@bitrix24/b24ui-nuxt 0.6.0 → 0.6.1

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

@@ -1,643 +1,8 @@
-import type { VariantProps } from 'tailwind-variants';
 import type { RadioGroupRootProps, RadioGroupRootEmits } from 'reka-ui';
-import type { AcceptableValue } from '../types/utils';
-declare const radioGroup: import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        danger: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        success: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        warning: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        primary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        secondary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        collab: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        ai: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    variant: {
-        list: {};
-        card: {
-            item: string;
-        };
-        table: {
-            item: string;
-        };
-    };
-    orientation: {
-        horizontal: {
-            fieldset: string;
-            wrapper: string;
-        };
-        vertical: {
-            fieldset: string;
-        };
-    };
-    indicator: {
-        start: {
-            item: string;
-            base: string;
-        };
-        end: {
-            item: string;
-            base: string;
-        };
-        hidden: {
-            base: string;
-            wrapper: string;
-        };
-    };
-    size: {
-        xs: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        sm: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        md: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        lg: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    disabled: {
-        true: {
-            base: string;
-            label: string;
-        };
-    };
-    required: {
-        true: {
-            label: string;
-        };
-    };
-}, {
-    root: string;
-    fieldset: string;
-    legend: string;
-    item: string;
-    base: string;
-    indicator: "end" | "start" | "hidden";
-    container: string;
-    wrapper: string;
-    label: string;
-    description: string;
-}, undefined, {
-    color: {
-        default: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        danger: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        success: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        warning: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        primary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        secondary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        collab: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        ai: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    variant: {
-        list: {};
-        card: {
-            item: string;
-        };
-        table: {
-            item: string;
-        };
-    };
-    orientation: {
-        horizontal: {
-            fieldset: string;
-            wrapper: string;
-        };
-        vertical: {
-            fieldset: string;
-        };
-    };
-    indicator: {
-        start: {
-            item: string;
-            base: string;
-        };
-        end: {
-            item: string;
-            base: string;
-        };
-        hidden: {
-            base: string;
-            wrapper: string;
-        };
-    };
-    size: {
-        xs: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        sm: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        md: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        lg: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    disabled: {
-        true: {
-            base: string;
-            label: string;
-        };
-    };
-    required: {
-        true: {
-            label: string;
-        };
-    };
-}, {
-    root: string;
-    fieldset: string;
-    legend: string;
-    item: string;
-    base: string;
-    indicator: "end" | "start" | "hidden";
-    container: string;
-    wrapper: string;
-    label: string;
-    description: string;
-}, import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        danger: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        success: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        warning: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        primary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        secondary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        collab: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        ai: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    variant: {
-        list: {};
-        card: {
-            item: string;
-        };
-        table: {
-            item: string;
-        };
-    };
-    orientation: {
-        horizontal: {
-            fieldset: string;
-            wrapper: string;
-        };
-        vertical: {
-            fieldset: string;
-        };
-    };
-    indicator: {
-        start: {
-            item: string;
-            base: string;
-        };
-        end: {
-            item: string;
-            base: string;
-        };
-        hidden: {
-            base: string;
-            wrapper: string;
-        };
-    };
-    size: {
-        xs: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        sm: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        md: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        lg: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    disabled: {
-        true: {
-            base: string;
-            label: string;
-        };
-    };
-    required: {
-        true: {
-            label: string;
-        };
-    };
-}, {
-    root: string;
-    fieldset: string;
-    legend: string;
-    item: string;
-    base: string;
-    indicator: "end" | "start" | "hidden";
-    container: string;
-    wrapper: string;
-    label: string;
-    description: string;
-}, undefined, {
-    color: {
-        default: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        danger: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        success: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        warning: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        primary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        secondary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        collab: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        ai: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    variant: {
-        list: {};
-        card: {
-            item: string;
-        };
-        table: {
-            item: string;
-        };
-    };
-    orientation: {
-        horizontal: {
-            fieldset: string;
-            wrapper: string;
-        };
-        vertical: {
-            fieldset: string;
-        };
-    };
-    indicator: {
-        start: {
-            item: string;
-            base: string;
-        };
-        end: {
-            item: string;
-            base: string;
-        };
-        hidden: {
-            base: string;
-            wrapper: string;
-        };
-    };
-    size: {
-        xs: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        sm: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        md: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        lg: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    disabled: {
-        true: {
-            base: string;
-            label: string;
-        };
-    };
-    required: {
-        true: {
-            label: string;
-        };
-    };
-}, {
-    root: string;
-    fieldset: string;
-    legend: string;
-    item: string;
-    base: string;
-    indicator: "end" | "start" | "hidden";
-    container: string;
-    wrapper: string;
-    label: string;
-    description: string;
-}, import("tailwind-variants").TVReturnType<{
-    color: {
-        default: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        danger: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        success: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        warning: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        primary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        secondary: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        collab: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        ai: {
-            base: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    variant: {
-        list: {};
-        card: {
-            item: string;
-        };
-        table: {
-            item: string;
-        };
-    };
-    orientation: {
-        horizontal: {
-            fieldset: string;
-            wrapper: string;
-        };
-        vertical: {
-            fieldset: string;
-        };
-    };
-    indicator: {
-        start: {
-            item: string;
-            base: string;
-        };
-        end: {
-            item: string;
-            base: string;
-        };
-        hidden: {
-            base: string;
-            wrapper: string;
-        };
-    };
-    size: {
-        xs: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        sm: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        md: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-        lg: {
-            fieldset: string;
-            legend: string;
-            base: string;
-            item: string;
-            label: string;
-            container: string;
-            indicator: "end" | "start" | "hidden";
-        };
-    };
-    disabled: {
-        true: {
-            base: string;
-            label: string;
-        };
-    };
-    required: {
-        true: {
-            label: string;
-        };
-    };
-}, {
-    root: string;
-    fieldset: string;
-    legend: string;
-    item: string;
-    base: string;
-    indicator: "end" | "start" | "hidden";
-    container: string;
-    wrapper: string;
-    label: string;
-    description: string;
-}, undefined, unknown, unknown, undefined>>>;
-type RadioGroupVariants = VariantProps<typeof radioGroup>;
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/b24ui/radio-group';
+import type { AcceptableValue, ComponentConfig } from '../types/utils';
+type RadioGroup = ComponentConfig<typeof theme, AppConfig, 'radioGroup'>;
 export type RadioGroupValue = AcceptableValue;
 export type RadioGroupItem = {
     label?: string;
@@ -672,15 +37,15 @@ export interface RadioGroupProps<T extends RadioGroupItem = RadioGroupItem> exte
     /**
      * @defaultValue 'md'
      */
-    size?: RadioGroupVariants['size'];
+    size?: RadioGroup['variants']['size'];
     /**
      * @defaultValue 'list'
      */
-    variant?: RadioGroupVariants['variant'];
+    variant?: RadioGroup['variants']['variant'];
     /**
      * @defaultValue 'primary'
      */
-    color?: RadioGroupVariants['color'];
+    color?: RadioGroup['variants']['color'];
     /**
      * The orientation the radio buttons are laid out.
      * @defaultValue 'vertical'
@@ -690,9 +55,9 @@ export interface RadioGroupProps<T extends RadioGroupItem = RadioGroupItem> exte
      * Position of the indicator.
      * @defaultValue 'start'
      */
-    indicator?: RadioGroupVariants['indicator'];
+    indicator?: RadioGroup['variants']['indicator'];
     class?: any;
-    b24ui?: Partial<typeof radioGroup.slots>;
+    b24ui?: RadioGroup['slots'];
 }
 export type RadioGroupEmits = RadioGroupRootEmits & {
     change: [payload: Event];

package/dist/runtime/components/Range.vue

@@ -1,16 +1,14 @@
 <script>
-import _appConfig from "#build/app.config";
 import theme from "#build/b24ui/range";
-import { tv } from "../utils/tv";
-const appConfigRange = _appConfig;
-const range = tv({ extend: tv(theme), ...appConfigRange.b24ui?.range || {} });
 </script>
 
 <script setup>
 import { computed } from "vue";
 import { SliderRoot, SliderRange, SliderTrack, SliderThumb, useForwardPropsEmits } from "reka-ui";
 import { reactivePick } from "@vueuse/core";
+import { useAppConfig } from "#imports";
 import { useFormField } from "../composables/useFormField";
+import { tv } from "../utils/tv";
 const props = defineProps({
   as: { type: null, required: false },
   size: { type: null, required: false },
@@ -18,7 +16,7 @@ const props = defineProps({
   orientation: { type: null, required: false, default: "horizontal" },
   defaultValue: { type: [Number, Array], required: false },
   class: { type: null, required: false },
-  b24ui: { type: Object, required: false },
+  b24ui: { type: null, required: false },
   name: { type: String, required: false },
   disabled: { type: Boolean, required: false },
   inverted: { type: Boolean, required: false },
@@ -29,6 +27,7 @@ const props = defineProps({
 });
 const emits = defineEmits(["update:modelValue", "change"]);
 const modelValue = defineModel({ type: [Number, Array] });
+const appConfig = useAppConfig();
 const rootProps = useForwardPropsEmits(reactivePick(props, "as", "orientation", "min", "max", "step", "minStepsBetweenThumbs", "inverted"), emits);
 const { id, emitFormChange, emitFormInput, size, color, name, disabled, ariaAttrs } = useFormField(props);
 const defaultRangeValue = computed(() => {
@@ -49,7 +48,7 @@ const rangeValue = computed({
   }
 });
 const thumbsCount = computed(() => rangeValue.value?.length ?? 1);
-const b24ui = computed(() => range({
+const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.range || {} })({
   disabled: disabled.value,
   size: size.value,
   color: color.value,