@bitrix24/b24ui-nuxt 0.6.0 → 0.6.1

package/dist/runtime/components/Calendar.vue

@@ -1,9 +1,5 @@
 <script>
-import _appConfig from "#build/app.config";
 import theme from "#build/b24ui/calendar";
-import { tv } from "../utils/tv";
-const appConfigCalendar = _appConfig;
-const calendar = tv({ extend: tv(theme), ...appConfigCalendar.b24ui?.calendar || {} });
 </script>
 
 <script setup>
@@ -11,7 +7,9 @@ import { computed } from "vue";
 import { useForwardPropsEmits } from "reka-ui";
 import { Calendar as SingleCalendar, RangeCalendar } from "reka-ui/namespaced";
 import { reactiveOmit } from "@vueuse/core";
+import { useAppConfig } from "#imports";
 import { useLocale } from "../composables/useLocale";
+import { tv } from "../utils/tv";
 import icons from "../dictionary/icons";
 import B24Button from "./Button.vue";
 const props = defineProps({
@@ -56,12 +54,13 @@ const props = defineProps({
 const emits = defineEmits(["update:modelValue", "update:placeholder", "update:startValue"]);
 defineSlots();
 const { code: locale, dir, t } = useLocale();
+const appConfig = useAppConfig();
 const rootProps = useForwardPropsEmits(reactiveOmit(props, "range", "modelValue", "defaultValue", "color", "size", "monthControls", "yearControls", "class", "b24ui"), emits);
 const nextYearIcon = computed(() => props.nextYearIcon || (dir.value === "rtl" ? icons.chevronDoubleLeft : icons.chevronDoubleRight));
 const nextMonthIcon = computed(() => props.nextMonthIcon || (dir.value === "rtl" ? icons.chevronLeft : icons.chevronRight));
 const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === "rtl" ? icons.chevronDoubleRight : icons.chevronDoubleLeft));
 const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === "rtl" ? icons.chevronRight : icons.chevronLeft));
-const b24ui = computed(() => calendar({
+const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.calendar || {} })({
   color: props.color,
   size: props.size
 }));

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

@@ -1,340 +1,10 @@
-import type { VariantProps } from 'tailwind-variants';
 import type { CalendarRootProps, CalendarRootEmits, RangeCalendarRootProps, RangeCalendarRootEmits, DateRange, CalendarCellTriggerProps } from 'reka-ui';
 import type { DateValue } from '@internationalized/date';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/b24ui/calendar';
 import type { IconComponent, ButtonProps } from '../types';
-import type { PartialString } from '../types/utils';
-declare const calendar: import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            cellTrigger: string;
-        };
-        danger: {
-            cellTrigger: string;
-        };
-        success: {
-            cellTrigger: string;
-        };
-        warning: {
-            cellTrigger: string;
-        };
-        primary: {
-            cellTrigger: string;
-        };
-        secondary: {
-            cellTrigger: string;
-        };
-        collab: {
-            cellTrigger: string;
-        };
-        ai: {
-            cellTrigger: string;
-        };
-    };
-    size: {
-        xs: {
-            heading: string;
-            cell: string;
-            headCell: string;
-            cellTrigger: string;
-            body: string;
-        };
-        sm: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        md: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        lg: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-    };
-}, {
-    root: string;
-    header: string;
-    body: string;
-    heading: string;
-    grid: string;
-    gridRow: string;
-    gridWeekDaysRow: string;
-    gridBody: string;
-    headCell: string;
-    cell: string;
-    cellTrigger: string;
-}, undefined, {
-    color: {
-        default: {
-            cellTrigger: string;
-        };
-        danger: {
-            cellTrigger: string;
-        };
-        success: {
-            cellTrigger: string;
-        };
-        warning: {
-            cellTrigger: string;
-        };
-        primary: {
-            cellTrigger: string;
-        };
-        secondary: {
-            cellTrigger: string;
-        };
-        collab: {
-            cellTrigger: string;
-        };
-        ai: {
-            cellTrigger: string;
-        };
-    };
-    size: {
-        xs: {
-            heading: string;
-            cell: string;
-            headCell: string;
-            cellTrigger: string;
-            body: string;
-        };
-        sm: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        md: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        lg: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-    };
-}, {
-    root: string;
-    header: string;
-    body: string;
-    heading: string;
-    grid: string;
-    gridRow: string;
-    gridWeekDaysRow: string;
-    gridBody: string;
-    headCell: string;
-    cell: string;
-    cellTrigger: string;
-}, import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            cellTrigger: string;
-        };
-        danger: {
-            cellTrigger: string;
-        };
-        success: {
-            cellTrigger: string;
-        };
-        warning: {
-            cellTrigger: string;
-        };
-        primary: {
-            cellTrigger: string;
-        };
-        secondary: {
-            cellTrigger: string;
-        };
-        collab: {
-            cellTrigger: string;
-        };
-        ai: {
-            cellTrigger: string;
-        };
-    };
-    size: {
-        xs: {
-            heading: string;
-            cell: string;
-            headCell: string;
-            cellTrigger: string;
-            body: string;
-        };
-        sm: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        md: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        lg: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-    };
-}, {
-    root: string;
-    header: string;
-    body: string;
-    heading: string;
-    grid: string;
-    gridRow: string;
-    gridWeekDaysRow: string;
-    gridBody: string;
-    headCell: string;
-    cell: string;
-    cellTrigger: string;
-}, undefined, {
-    color: {
-        default: {
-            cellTrigger: string;
-        };
-        danger: {
-            cellTrigger: string;
-        };
-        success: {
-            cellTrigger: string;
-        };
-        warning: {
-            cellTrigger: string;
-        };
-        primary: {
-            cellTrigger: string;
-        };
-        secondary: {
-            cellTrigger: string;
-        };
-        collab: {
-            cellTrigger: string;
-        };
-        ai: {
-            cellTrigger: string;
-        };
-    };
-    size: {
-        xs: {
-            heading: string;
-            cell: string;
-            headCell: string;
-            cellTrigger: string;
-            body: string;
-        };
-        sm: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        md: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        lg: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-    };
-}, {
-    root: string;
-    header: string;
-    body: string;
-    heading: string;
-    grid: string;
-    gridRow: string;
-    gridWeekDaysRow: string;
-    gridBody: string;
-    headCell: string;
-    cell: string;
-    cellTrigger: string;
-}, import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            cellTrigger: string;
-        };
-        danger: {
-            cellTrigger: string;
-        };
-        success: {
-            cellTrigger: string;
-        };
-        warning: {
-            cellTrigger: string;
-        };
-        primary: {
-            cellTrigger: string;
-        };
-        secondary: {
-            cellTrigger: string;
-        };
-        collab: {
-            cellTrigger: string;
-        };
-        ai: {
-            cellTrigger: string;
-        };
-    };
-    size: {
-        xs: {
-            heading: string;
-            cell: string;
-            headCell: string;
-            cellTrigger: string;
-            body: string;
-        };
-        sm: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        md: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-        lg: {
-            heading: string;
-            headCell: string;
-            cell: string;
-            cellTrigger: string;
-        };
-    };
-}, {
-    root: string;
-    header: string;
-    body: string;
-    heading: string;
-    grid: string;
-    gridRow: string;
-    gridWeekDaysRow: string;
-    gridBody: string;
-    headCell: string;
-    cell: string;
-    cellTrigger: string;
-}, undefined, unknown, unknown, undefined>>>;
-type CalendarVariants = VariantProps<typeof calendar>;
+import type { ComponentConfig } from '../types/utils';
+type Calendar = ComponentConfig<typeof theme, AppConfig, 'calendar'>;
 type CalendarDefaultValue<R extends boolean = false, M extends boolean = false> = R extends true ? DateRange : M extends true ? DateValue[] : DateValue;
 type CalendarModelValue<R extends boolean = false, M extends boolean = false> = R extends true ? (DateRange | null) : M extends true ? (DateValue[] | undefined) : (DateValue | undefined);
 type _CalendarRootProps = Omit<CalendarRootProps, 'as' | 'asChild' | 'modelValue' | 'defaultValue' | 'dir' | 'locale' | 'calendarLabel' | 'multiple'>;
@@ -392,11 +62,11 @@ export interface CalendarProps<R extends boolean = false, M extends boolean = fa
     /**
      * @defaultValue 'primary'
      */
-    color?: CalendarVariants['color'];
+    color?: Calendar['variants']['color'];
     /**
      * @defaultValue 'md'
      */
-    size?: CalendarVariants['size'];
+    size?: Calendar['variants']['size'];
     /** Whether a range of dates can be selected */
     range?: R & boolean;
     /** Whether multiple dates can be selected */
@@ -408,7 +78,7 @@ export interface CalendarProps<R extends boolean = false, M extends boolean = fa
     defaultValue?: CalendarDefaultValue<R, M>;
     modelValue?: CalendarModelValue<R, M>;
     class?: any;
-    b24ui?: PartialString<typeof calendar.slots>;
+    b24ui?: Calendar['slots'];
 }
 export interface CalendarEmits<R extends boolean, M extends boolean> extends Omit<CalendarRootEmits & RangeCalendarRootEmits, 'update:modelValue'> {
     'update:modelValue': [date: CalendarModelValue<R, M>];

package/dist/runtime/components/Checkbox.vue

@@ -1,16 +1,14 @@
 <script>
-import _appConfig from "#build/app.config";
 import theme from "#build/b24ui/checkbox";
-import { tv } from "../utils/tv";
-const appConfigCheckbox = _appConfig;
-const checkbox = tv({ extend: tv(theme), ...appConfigCheckbox.b24ui?.checkbox || {} });
 </script>
 
 <script setup>
 import { computed, useId } from "vue";
 import { Primitive, CheckboxRoot, CheckboxIndicator, Label, useForwardProps } from "reka-ui";
 import { reactivePick } from "@vueuse/core";
+import { useAppConfig } from "#imports";
 import { useFormField } from "../composables/useFormField";
+import { tv } from "../utils/tv";
 import Minus20Icon from "@bitrix24/b24icons-vue/actions/Minus20Icon";
 import CheckIcon from "@bitrix24/b24icons-vue/main/CheckIcon";
 defineOptions({ inheritAttrs: false });
@@ -21,7 +19,7 @@ const props = defineProps({
   color: { type: null, required: false },
   size: { type: null, required: false },
   class: { type: null, required: false },
-  b24ui: { type: Object, required: false },
+  b24ui: { type: null, required: false },
   disabled: { type: Boolean, required: false },
   required: { type: Boolean, required: false },
   name: { type: String, required: false },
@@ -32,10 +30,11 @@ const props = defineProps({
 const slots = defineSlots();
 const emits = defineEmits(["change"]);
 const modelValue = defineModel({ type: [Boolean, String], ...{ default: void 0 } });
+const appConfig = useAppConfig();
 const rootProps = useForwardProps(reactivePick(props, "required", "value", "defaultValue"));
 const { id: _id, emitFormChange, emitFormInput, size, color, name, disabled, ariaAttrs } = useFormField(props);
 const id = _id.value ?? useId();
-const b24ui = computed(() => checkbox({
+const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.checkbox || {} })({
   size: size.value,
   color: color.value,
   required: props.required,