@bitrix24/b24ui-nuxt 0.2.2 → 0.2.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/.nuxt/b24ui/button.ts +9 -2
  2. package/.nuxt/b24ui/checkbox.ts +1 -1
  3. package/.nuxt/b24ui/index.ts +2 -0
  4. package/.nuxt/b24ui/input-menu.ts +1 -1
  5. package/.nuxt/b24ui/input-number.ts +417 -0
  6. package/.nuxt/b24ui/modal.ts +28 -0
  7. package/.nuxt/b24ui/radio-group.ts +1 -1
  8. package/.nuxt/b24ui/range.ts +1 -1
  9. package/.nuxt/b24ui/select-menu.ts +1 -1
  10. package/.nuxt/b24ui/select.ts +1 -1
  11. package/.nuxt/b24ui/switch.ts +1 -1
  12. package/.nuxt/b24ui/tabs.ts +2 -2
  13. package/.nuxt/b24ui/toaster.ts +4 -4
  14. package/README.md +1 -1
  15. package/dist/meta.cjs +4306 -655
  16. package/dist/meta.d.cts +4306 -655
  17. package/dist/meta.d.mts +4306 -655
  18. package/dist/meta.d.ts +4306 -655
  19. package/dist/meta.mjs +4306 -655
  20. package/dist/module.cjs +2 -1
  21. package/dist/module.json +1 -1
  22. package/dist/module.mjs +2 -1
  23. package/dist/runtime/components/App.vue +2 -2
  24. package/dist/runtime/components/DropdownMenu.vue +3 -3
  25. package/dist/runtime/components/InputNumber.vue +218 -0
  26. package/dist/runtime/components/Modal.vue +179 -0
  27. package/dist/runtime/components/ModalDialogClose.vue +17 -0
  28. package/dist/runtime/components/ModalProvider.vue +12 -0
  29. package/dist/runtime/composables/useModal.d.ts +17 -0
  30. package/dist/runtime/composables/useModal.js +46 -0
  31. package/dist/runtime/plugins/modal.d.ts +2 -0
  32. package/dist/runtime/plugins/modal.js +10 -0
  33. package/dist/runtime/types/index.d.ts +3 -0
  34. package/dist/runtime/types/index.js +3 -0
  35. package/dist/shared/{b24ui-nuxt.DgnM0VWe.cjs → b24ui-nuxt.DGjopCKm.cjs} +478 -26
  36. package/dist/shared/{b24ui-nuxt.CYvh5VlN.mjs → b24ui-nuxt.V9TzyCqH.mjs} +478 -26
  37. package/dist/unplugin.cjs +1 -1
  38. package/dist/unplugin.mjs +1 -1
  39. package/dist/vite.cjs +1 -1
  40. package/dist/vite.mjs +1 -1
  41. package/package.json +6 -4
@@ -718,7 +718,8 @@ const button = {
718
718
  slots: {
719
719
  base: [
720
720
  "select-none cursor-pointer inline-flex items-center",
721
- "relative focus:outline-hidden",
721
+ "relative",
722
+ "outline-transparent focus:outline-hidden focus-visible:outline-2 focus-visible:outline-offset-2",
722
723
  "disabled:cursor-not-allowed aria-disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:opacity-50",
723
724
  "transition duration-150 ease-linear"
724
725
  // transition-colors
@@ -735,7 +736,6 @@ const button = {
735
736
  variants: {
736
737
  ...buttonGroupVariant,
737
738
  color: {
738
- // DEFAULT ////
739
739
  default: [
740
740
  "text-white dark:text-base-100 bg-base-650 border border-base-650",
741
741
  "hover:bg-base-850 hover:border-base-850 hover:focus-visible:ring-0",
@@ -752,7 +752,6 @@ const button = {
752
752
  "focus-visible:outline-red-720",
753
753
  "ring-red-800 focus-visible:ring-red-800"
754
754
  ].join(" "),
755
- // SUCCESS ////
756
755
  success: [
757
756
  "text-base-900 bg-green-450 border border-green-450",
758
757
  "hover:bg-green-370 hover:border-green-370 hover:focus-visible:ring-0",
@@ -761,7 +760,6 @@ const button = {
761
760
  "focus-visible:outline-green-450",
762
761
  "ring-green-500 focus-visible:ring-green-500"
763
762
  ].join(" "),
764
- // new WARNING ////
765
763
  warning: [
766
764
  "text-white dark:text-orange-100 bg-orange-500 border border-orange-500",
767
765
  "hover:bg-orange-500/75 hover:border-orange-500/75 hover:focus-visible:ring-0",
@@ -770,7 +768,6 @@ const button = {
770
768
  "focus-visible:outline-orange-500",
771
769
  "ring-orange-800 focus-visible:ring-orange-800"
772
770
  ].join(" "),
773
- // PRIMARY ////
774
771
  primary: [
775
772
  "text-white dark:text-blue-100 bg-blue-530 border border-blue-530",
776
773
  "hover:bg-blue-450 hover:border-blue-450 hover:focus-visible:ring-0",
@@ -779,7 +776,6 @@ const button = {
779
776
  "focus-visible:outline-blue-530",
780
777
  "ring-blue-800 focus-visible:ring-blue-800"
781
778
  ].join(" "),
782
- // SECONDARY ////
783
779
  secondary: [
784
780
  "text-base-900 bg-cyan-160 border border-cyan-230",
785
781
  "hover:bg-cyan-150 hover:border-cyan-230 hover:focus-visible:ring-0",
@@ -788,7 +784,6 @@ const button = {
788
784
  "focus-visible:outline-cyan-160",
789
785
  "ring-cyan-500 focus-visible:ring-cyan-500"
790
786
  ].join(" "),
791
- // COLLAB ////
792
787
  collab: [
793
788
  "text-white dark:text-collab-100 bg-collab-600 border border-collab-600",
794
789
  "hover:bg-collab-500 hover:border-collab-500 hover:focus-visible:ring-0",
@@ -797,7 +792,6 @@ const button = {
797
792
  "focus-visible:outline-collab-600",
798
793
  "ring-collab-900 focus-visible:ring-collab-900"
799
794
  ].join(" "),
800
- // AI ////
801
795
  ai: [
802
796
  "text-white dark:text-ai-100 bg-ai-450 border border-ai-450",
803
797
  "hover:bg-ai-370 hover:border-ai-370 hover:focus-visible:ring-0",
@@ -806,7 +800,6 @@ const button = {
806
800
  "focus-visible:outline-ai-450",
807
801
  "ring-ai-900 focus-visible:ring-ai-900"
808
802
  ].join(" "),
809
- // LINK ////
810
803
  link: [
811
804
  "no-underline decoration-solid decoration-auto",
812
805
  "text-base-900 decoration-gray-900 bg-transparent border border-transparent dark:text-base-300",
@@ -894,7 +887,6 @@ const button = {
894
887
  compoundVariants: [
895
888
  // region default ////
896
889
  {
897
- // BASE_LIGHT ////
898
890
  color: "default",
899
891
  depth: "light",
900
892
  class: [
@@ -902,7 +894,8 @@ const button = {
902
894
  "hover:bg-base-320 hover:border-base-320 hover:focus-visible:ring-0",
903
895
  "active:bg-base-250 active:border-base-250 active:focus-visible:ring-0",
904
896
  "disabled:bg-base-200 aria-disabled:bg-base-200 disabled:border-base-300 aria-disabled:border-base-300",
905
- "focus-visible:outline-base-200"
897
+ "focus-visible:outline-base-200",
898
+ "ring-base-320 focus-visible:ring-base-320"
906
899
  ].join(" ")
907
900
  },
908
901
  {
@@ -1123,12 +1116,18 @@ const button = {
1123
1116
  ].join(" ")
1124
1117
  },
1125
1118
  {
1126
- // LIGHT_BORDER ////
1119
+ // LINK ////
1127
1120
  color: "link",
1128
1121
  depth: "light",
1129
1122
  useLabel: true,
1130
1123
  class: "ps-1.5 pe-1.5"
1131
1124
  },
1125
+ {
1126
+ color: "link",
1127
+ depth: "normal",
1128
+ useLabel: true,
1129
+ class: "ps-0 pe-0"
1130
+ },
1132
1131
  {
1133
1132
  // LIGHT_BORDER ////
1134
1133
  color: "link",
@@ -1264,7 +1263,11 @@ const button = {
1264
1263
  const checkbox = {
1265
1264
  slots: {
1266
1265
  root: "relative flex items-start",
1267
- base: "cursor-pointer shrink-0 flex items-center justify-center rounded-2xs text-white dark:text-base-150 ring ring-inset ring-base-300 dark:ring-base-700 focus-visible:outline-2 focus-visible:outline-offset-2",
1266
+ base: [
1267
+ "cursor-pointer shrink-0 flex items-center justify-center rounded-2xs text-white dark:text-base-150",
1268
+ "ring ring-inset ring-base-300 dark:ring-base-700",
1269
+ "outline-transparent focus-visible:outline-2 focus-visible:outline-offset-2"
1270
+ ].join(" "),
1268
1271
  container: "flex items-center",
1269
1272
  wrapper: "font-b24-primary ms-2",
1270
1273
  icon: "shrink-0 size-full",
@@ -2475,9 +2478,9 @@ const inputMenu = () => {
2475
2478
  trailing: "group absolute inset-y-0 end-0 flex items-center disabled:cursor-not-allowed disabled:opacity-75",
2476
2479
  arrow: "fill-base-master/10 dark:fill-base-100/20",
2477
2480
  content: [
2478
- "w-[var(--reka-popper-anchor-width)]",
2481
+ "w-(--reka-popper-anchor-width)",
2479
2482
  // 'max-h-60',
2480
- // 'h-[var(--reka-popper-available-height)]',
2483
+ // 'h-(--reka-popper-available-height)',
2481
2484
  "bg-white dark:bg-base-dark",
2482
2485
  "shadow-md rounded-2xs ring ring-base-300 dark:ring-base-800",
2483
2486
  "overflow-hidden",
@@ -2687,6 +2690,404 @@ const inputMenu = () => {
2687
2690
  }, input);
2688
2691
  };
2689
2692
 
2693
+ const inputNumber = () => {
2694
+ const input$1 = input;
2695
+ return {
2696
+ slots: {
2697
+ root: "relative inline-flex items-center",
2698
+ base: [
2699
+ "w-full py-0 border-0 focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
2700
+ "placeholder:text-base-400",
2701
+ "dark:placeholder:text-base-300",
2702
+ "appearance-none transition duration-300 ease-linear",
2703
+ // transition-colors
2704
+ "ring ring-inset ring-base-300",
2705
+ "dark:ring-base-800",
2706
+ "text-base-master bg-white placeholder:text-base-400 hover:text-base-900 focus:text-base-900 active:text-base-900",
2707
+ "dark:text-base-150 dark:bg-transparent dark:placeholder:text-base-300 dark:hover:text-base-350 dark:focus:text-base-350 dark:active:text-base-350",
2708
+ "font-b24-primary font-regular text-md leading-none",
2709
+ "align-middle",
2710
+ "text-ellipsis whitespace-nowrap"
2711
+ ].join(" "),
2712
+ increment: "absolute flex items-center",
2713
+ decrement: "absolute flex items-center",
2714
+ tag: input$1.slots.tag
2715
+ },
2716
+ variants: {
2717
+ size: {
2718
+ xs: "px-2 h-xl2 gap-1",
2719
+ sm: "px-2.5 h-8 gap-1.5",
2720
+ md: "px-2.5 h-10 gap-1.5",
2721
+ lg: "px-3 h-12 gap-2"
2722
+ },
2723
+ color: {
2724
+ default: "",
2725
+ danger: "",
2726
+ success: "",
2727
+ warning: "",
2728
+ primary: "",
2729
+ secondary: "",
2730
+ collab: "",
2731
+ ai: ""
2732
+ },
2733
+ tagColor: {
2734
+ ...input$1.variants.tagColor
2735
+ },
2736
+ rounded: {
2737
+ ...input$1.variants.rounded
2738
+ },
2739
+ noPadding: {
2740
+ ...input$1.variants.noPadding
2741
+ },
2742
+ noBorder: {
2743
+ ...input$1.variants.noBorder
2744
+ },
2745
+ underline: {
2746
+ ...input$1.variants.underline
2747
+ },
2748
+ disabled: {
2749
+ true: {
2750
+ increment: "opacity-75 cursor-not-allowed",
2751
+ decrement: "opacity-75 cursor-not-allowed"
2752
+ }
2753
+ },
2754
+ orientation: {
2755
+ horizontal: {
2756
+ base: "text-center",
2757
+ increment: "inset-y-0 end-0 py-0 pe-0 [&>button]:p-1",
2758
+ decrement: "inset-y-0 start-0 py-0 ps-0 [&>button]:p-1"
2759
+ },
2760
+ vertical: {
2761
+ increment: "top-1 end-0 pe-1 [&>button]:p-0",
2762
+ decrement: "bottom-1 end-0 pe-1 [&>button]:p-0"
2763
+ }
2764
+ },
2765
+ highlight: {
2766
+ true: ""
2767
+ }
2768
+ },
2769
+ compoundVariants: [
2770
+ // region ring for focus and highlight ////
2771
+ // region default ////
2772
+ {
2773
+ color: "default",
2774
+ noBorder: false,
2775
+ underline: false,
2776
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-base-900 dark:focus-visible:ring-base-350"
2777
+ },
2778
+ {
2779
+ color: "default",
2780
+ highlight: true,
2781
+ noBorder: false,
2782
+ underline: false,
2783
+ class: "ring ring-inset ring-base-900 dark:ring-base-350"
2784
+ },
2785
+ {
2786
+ color: "default",
2787
+ noBorder: false,
2788
+ underline: true,
2789
+ class: "focus-visible:border-base-900 dark:focus-visible:border-b-base-350"
2790
+ },
2791
+ {
2792
+ color: "default",
2793
+ highlight: true,
2794
+ noBorder: false,
2795
+ underline: true,
2796
+ class: "border-b-base-900 dark:border-b-base-350"
2797
+ },
2798
+ // endregion ////
2799
+ // region danger ////
2800
+ {
2801
+ color: "danger",
2802
+ noBorder: false,
2803
+ underline: false,
2804
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-red-500 dark:focus-visible:ring-red-600"
2805
+ },
2806
+ {
2807
+ color: "danger",
2808
+ highlight: true,
2809
+ noBorder: false,
2810
+ underline: false,
2811
+ class: "ring ring-inset ring-red-500 dark:ring-red-600"
2812
+ },
2813
+ {
2814
+ color: "danger",
2815
+ noBorder: false,
2816
+ underline: true,
2817
+ class: "focus-visible:border-b-red-500 dark:focus-visible:border-b-red-600"
2818
+ },
2819
+ {
2820
+ color: "danger",
2821
+ highlight: true,
2822
+ noBorder: false,
2823
+ underline: true,
2824
+ class: "border-b-red-500 dark:border-b-red-600"
2825
+ },
2826
+ // endregion ////
2827
+ // region success ////
2828
+ {
2829
+ color: "success",
2830
+ noBorder: false,
2831
+ underline: false,
2832
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-green-500 dark:focus-visible:ring-green-600"
2833
+ },
2834
+ {
2835
+ color: "success",
2836
+ highlight: true,
2837
+ noBorder: false,
2838
+ underline: false,
2839
+ class: "ring ring-inset ring-green-500 dark:ring-green-600"
2840
+ },
2841
+ {
2842
+ color: "success",
2843
+ noBorder: false,
2844
+ underline: true,
2845
+ class: "focus-visible:border-b-green-500 dark:focus-visible:border-b-green-600"
2846
+ },
2847
+ {
2848
+ color: "success",
2849
+ highlight: true,
2850
+ noBorder: false,
2851
+ underline: true,
2852
+ class: "border-b-green-500 dark:border-b-green-600"
2853
+ },
2854
+ // endregion ////
2855
+ // region warning ////
2856
+ {
2857
+ color: "warning",
2858
+ noBorder: false,
2859
+ underline: false,
2860
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-orange-500 dark:focus-visible:ring-orange-600"
2861
+ },
2862
+ {
2863
+ color: "warning",
2864
+ highlight: true,
2865
+ noBorder: false,
2866
+ underline: false,
2867
+ class: "ring ring-inset ring-orange-500 dark:ring-orange-600"
2868
+ },
2869
+ {
2870
+ color: "warning",
2871
+ noBorder: false,
2872
+ underline: true,
2873
+ class: "focus-visible:border-b-orange-500 dark:focus-visible:border-b-orange-600"
2874
+ },
2875
+ {
2876
+ color: "warning",
2877
+ highlight: true,
2878
+ noBorder: false,
2879
+ underline: true,
2880
+ class: "border-b-orange-500 dark:border-b-orange-600"
2881
+ },
2882
+ // endregion ////
2883
+ // region primary ////
2884
+ {
2885
+ color: "primary",
2886
+ noBorder: false,
2887
+ underline: false,
2888
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-blue-500 dark:focus-visible:ring-blue-600"
2889
+ },
2890
+ {
2891
+ color: "primary",
2892
+ highlight: true,
2893
+ noBorder: false,
2894
+ underline: false,
2895
+ class: "ring ring-inset ring-blue-500 dark:ring-blue-600"
2896
+ },
2897
+ {
2898
+ color: "primary",
2899
+ noBorder: false,
2900
+ underline: true,
2901
+ class: "focus-visible:border-b-blue-500 dark:focus-visible:border-b-blue-600"
2902
+ },
2903
+ {
2904
+ color: "primary",
2905
+ highlight: true,
2906
+ noBorder: false,
2907
+ underline: true,
2908
+ class: "border-b-blue-500 dark:border-b-blue-600"
2909
+ },
2910
+ // endregion ////
2911
+ // region secondary ////
2912
+ {
2913
+ color: "secondary",
2914
+ noBorder: false,
2915
+ underline: false,
2916
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-cyan-500 dark:focus-visible:ring-cyan-600"
2917
+ },
2918
+ {
2919
+ color: "secondary",
2920
+ highlight: true,
2921
+ noBorder: false,
2922
+ underline: false,
2923
+ class: "ring ring-inset ring-cyan-500 dark:ring-cyan-600"
2924
+ },
2925
+ {
2926
+ color: "secondary",
2927
+ noBorder: false,
2928
+ underline: true,
2929
+ class: "focus-visible:border-b-cyan-500 dark:focus-visible:border-b-cyan-600"
2930
+ },
2931
+ {
2932
+ color: "secondary",
2933
+ highlight: true,
2934
+ noBorder: false,
2935
+ underline: true,
2936
+ class: "border-b-cyan-500 dark:border-b-cyan-600"
2937
+ },
2938
+ // endregion ////
2939
+ // region collab ////
2940
+ {
2941
+ color: "collab",
2942
+ noBorder: false,
2943
+ underline: false,
2944
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-collab-500 dark:focus-visible:ring-collab-600"
2945
+ },
2946
+ {
2947
+ color: "collab",
2948
+ highlight: true,
2949
+ noBorder: false,
2950
+ underline: false,
2951
+ class: "ring ring-inset ring-collab-500 dark:ring-collab-600"
2952
+ },
2953
+ {
2954
+ color: "collab",
2955
+ noBorder: false,
2956
+ underline: true,
2957
+ class: "focus-visible:border-b-collab-500 dark:focus-visible:border-b-collab-600"
2958
+ },
2959
+ {
2960
+ color: "collab",
2961
+ highlight: true,
2962
+ noBorder: false,
2963
+ underline: true,
2964
+ class: "border-b-collab-500 dark:border-b-collab-600"
2965
+ },
2966
+ // endregion ////
2967
+ // region ai ////
2968
+ {
2969
+ color: "ai",
2970
+ noBorder: false,
2971
+ underline: false,
2972
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ai-500 dark:focus-visible:ring-ai-600"
2973
+ },
2974
+ {
2975
+ color: "ai",
2976
+ highlight: true,
2977
+ noBorder: false,
2978
+ underline: false,
2979
+ class: "ring ring-inset ring-ai-500 dark:ring-ai-600"
2980
+ },
2981
+ {
2982
+ color: "ai",
2983
+ noBorder: false,
2984
+ underline: true,
2985
+ class: "focus-visible:border-b-ai-500 dark:focus-visible:border-b-ai-600"
2986
+ },
2987
+ {
2988
+ color: "ai",
2989
+ highlight: true,
2990
+ noBorder: false,
2991
+ underline: true,
2992
+ class: "border-b-ai-500 dark:border-b-ai-600"
2993
+ },
2994
+ // endregion ////
2995
+ // endregion ////
2996
+ // region orientation && size ////
2997
+ // region horizontal ////
2998
+ {
2999
+ orientation: "horizontal",
3000
+ rounded: true,
3001
+ class: {
3002
+ increment: "[&>button]:rounded-3xl",
3003
+ decrement: "[&>button]:rounded-3xl"
3004
+ }
3005
+ },
3006
+ {
3007
+ orientation: "horizontal",
3008
+ size: "xs",
3009
+ class: {
3010
+ base: "px-[1.3rem]",
3011
+ increment: "[&>button]:h-[24px] scale-80",
3012
+ decrement: "[&>button]:h-[24px] scale-80"
3013
+ }
3014
+ },
3015
+ {
3016
+ orientation: "horizontal",
3017
+ size: "sm",
3018
+ class: {
3019
+ base: "px-[2.1rem]",
3020
+ increment: "scale-80",
3021
+ decrement: "scale-80"
3022
+ }
3023
+ },
3024
+ {
3025
+ orientation: "horizontal",
3026
+ size: "md",
3027
+ class: {
3028
+ base: "px-[2.45rem]",
3029
+ increment: "[&>button]:p-1.5 scale-80",
3030
+ decrement: "[&>button]:p-1.5 scale-80"
3031
+ }
3032
+ },
3033
+ {
3034
+ orientation: "horizontal",
3035
+ size: "lg",
3036
+ class: {
3037
+ base: "px-[2.95rem]",
3038
+ increment: "pe-1 [&>button]:p-1.5 [&>button]:h-[42px] scale-95",
3039
+ decrement: "ps-1 [&>button]:p-1.5 [&>button]:h-[42px] scale-95"
3040
+ }
3041
+ },
3042
+ // endregion ////
3043
+ // region vertical ////
3044
+ {
3045
+ orientation: "vertical",
3046
+ size: "xs",
3047
+ class: {
3048
+ base: "pe-7",
3049
+ increment: "top-0 pe-0 [&>button]:h-[13px]",
3050
+ decrement: "bottom-0 pe-0 [&>button]:h-[13px]"
3051
+ }
3052
+ },
3053
+ {
3054
+ orientation: "vertical",
3055
+ size: "sm",
3056
+ class: {
3057
+ base: "pe-8",
3058
+ increment: "[&>button]:h-[13px] scale-80",
3059
+ decrement: "[&>button]:h-[13px] scale-80"
3060
+ }
3061
+ },
3062
+ {
3063
+ orientation: "vertical",
3064
+ size: "md",
3065
+ class: {
3066
+ base: "pe-9",
3067
+ increment: "[&>button]:h-[19px] scale-80",
3068
+ decrement: "[&>button]:h-[19px] scale-80"
3069
+ }
3070
+ },
3071
+ {
3072
+ orientation: "vertical",
3073
+ size: "lg",
3074
+ class: {
3075
+ base: "pe-9",
3076
+ increment: "[&>button]:h-[22px] scale-80",
3077
+ decrement: "[&>button]:h-[22px] scale-80"
3078
+ }
3079
+ }
3080
+ // endregion ////
3081
+ // endregion ////
3082
+ ],
3083
+ defaultVariants: {
3084
+ size: "md",
3085
+ color: "primary",
3086
+ tagColor: "primary"
3087
+ }
3088
+ };
3089
+ };
3090
+
2690
3091
  const kbd = {
2691
3092
  base: "inline-flex items-center justify-center px-1 rounded-2xs font-normal font-b24-system-mono",
2692
3093
  variants: {
@@ -2750,6 +3151,46 @@ const link = (options) => ({
2750
3151
  }
2751
3152
  });
2752
3153
 
3154
+ const modal = {
3155
+ slots: {
3156
+ overlay: "fixed inset-0 bg-base-950/20 dark:bg-base-950/30",
3157
+ content: [
3158
+ "py-md2 px-5",
3159
+ "fixed w-full h-dvh bg-white dark:bg-base-950",
3160
+ // 'divide-y divide-base-900/10 dark:divide-white/20',
3161
+ "flex flex-col focus:outline-none"
3162
+ ].join(" "),
3163
+ header: "pe-5 pt-0",
3164
+ body: "flex-1 overflow-y-auto my-2.5 text-md leading-normal",
3165
+ footer: "flex items-center justify-center gap-3 mt-2.5 pt-4 border-t border-t-1 border-t-base-900/10 dark:border-t-white/20",
3166
+ title: "font-bold text-md leading-normal text-base-900 dark:text-base-150",
3167
+ description: "mt-0.5 mb-1 text-base-500 dark:text-base-400 text-sm",
3168
+ close: "absolute top-2 end-1.5 p-0.5"
3169
+ },
3170
+ variants: {
3171
+ transition: {
3172
+ true: {
3173
+ overlay: "data-[state=open]:animate-[fade-in_200ms_ease-out] data-[state=closed]:animate-[fade-out_200ms_ease-in]",
3174
+ content: "data-[state=open]:animate-[scale-in_200ms_ease-out] data-[state=closed]:animate-[scale-out_200ms_ease-in]"
3175
+ }
3176
+ },
3177
+ fullscreen: {
3178
+ true: {
3179
+ content: "inset-0"
3180
+ },
3181
+ false: {
3182
+ content: [
3183
+ "top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]",
3184
+ "sm:min-w-[400px]",
3185
+ "sm:max-w-[420px] sm:h-auto sm:max-h-[calc(100vh-4rem)]",
3186
+ "sm:rounded-md sm:shadow-lg",
3187
+ "sm:ring ring-base-300 dark:ring-base-800"
3188
+ ].join(" ")
3189
+ }
3190
+ }
3191
+ }
3192
+ };
3193
+
2753
3194
  const progress = {
2754
3195
  slots: {
2755
3196
  root: "gap-2",
@@ -3030,7 +3471,11 @@ const radioGroup = {
3030
3471
  fieldset: "flex",
3031
3472
  legend: "mb-1.5 block font-medium text-base-master dark:text-base-400",
3032
3473
  item: "flex items-start",
3033
- base: "cursor-pointer rounded-full ring ring-inset ring-base-300 dark:ring-base-700 focus-visible:outline-2 focus-visible:outline-offset-2",
3474
+ base: [
3475
+ "cursor-pointer rounded-full",
3476
+ "ring ring-inset ring-base-300 dark:ring-base-700",
3477
+ "outline-transparent focus-visible:outline-2 focus-visible:outline-offset-2"
3478
+ ].join(" "),
3034
3479
  indicator: " flex items-center justify-center size-full rounded-full after:bg-white dark:after:bg-base-dark after:rounded-full",
3035
3480
  container: "flex items-center",
3036
3481
  wrapper: "font-b24-primary font-regular ms-2",
@@ -3142,7 +3587,11 @@ const range = {
3142
3587
  root: "relative flex items-center select-none touch-none",
3143
3588
  track: "relative bg-base-200 dark:bg-base-800 overflow-hidden rounded-full grow",
3144
3589
  range: "absolute rounded-full",
3145
- thumb: "rounded-full bg-white dark:bg-base-100 ring-2 focus-visible:outline-2 focus-visible:outline-offset-2"
3590
+ thumb: [
3591
+ "rounded-full bg-white dark:bg-base-100",
3592
+ "ring-2",
3593
+ "outline-transparent focus-visible:outline-2 focus-visible:outline-offset-2"
3594
+ ].join(" ")
3146
3595
  },
3147
3596
  variants: {
3148
3597
  color: {
@@ -3328,9 +3777,9 @@ const select = () => {
3328
3777
  placeholder: "truncate text-base-400 dark:text-base-300",
3329
3778
  arrow: "fill-base-master/10 dark:fill-base-100/20",
3330
3779
  content: [
3331
- "w-[var(--reka-popper-anchor-width)]",
3780
+ "w-(--reka-popper-anchor-width)",
3332
3781
  // 'max-h-60',
3333
- // 'h-[var(--reka-popper-available-height)]',
3782
+ // 'h-(--reka-popper-available-height)',
3334
3783
  "bg-white dark:bg-base-dark",
3335
3784
  "shadow-md rounded-2xs ring ring-base-300 dark:ring-base-800",
3336
3785
  "overflow-hidden",
@@ -3540,7 +3989,8 @@ const _switch = {
3540
3989
  slots: {
3541
3990
  root: "relative flex items-start",
3542
3991
  base: [
3543
- "cursor-pointer inline-flex items-center shrink-0 rounded-full border-2 border-transparent focus-visible:outline-2 focus-visible:outline-offset-2 data-[state=unchecked]:bg-base-200 dark:data-[state=unchecked]:bg-base-800",
3992
+ "cursor-pointer inline-flex items-center shrink-0 rounded-full border-2 border-transparent data-[state=unchecked]:bg-base-200 dark:data-[state=unchecked]:bg-base-800",
3993
+ "outline-transparent focus-visible:outline-2 focus-visible:outline-offset-2",
3544
3994
  "transition-colors duration-200"
3545
3995
  ].join(" "),
3546
3996
  container: "flex items-center",
@@ -3698,12 +4148,12 @@ const tabs = {
3698
4148
  horizontal: {
3699
4149
  root: "flex-col",
3700
4150
  list: "w-full",
3701
- indicator: "left-0 w-[var(--reka-tabs-indicator-size)] translate-x-[var(--reka-tabs-indicator-position)]",
4151
+ indicator: "left-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position)",
3702
4152
  trigger: "justify-center"
3703
4153
  },
3704
4154
  vertical: {
3705
4155
  list: "flex-col",
3706
- indicator: "top-0 h-[var(--reka-tabs-indicator-size)] translate-y-[var(--reka-tabs-indicator-position)]"
4156
+ indicator: "top-0 h-(--reka-tabs-indicator-size) translate-y-(--reka-tabs-indicator-position)"
3707
4157
  }
3708
4158
  },
3709
4159
  size: {
@@ -4393,8 +4843,8 @@ const toast = {
4393
4843
 
4394
4844
  const toaster = {
4395
4845
  slots: {
4396
- viewport: "fixed flex flex-col w-[calc(100%-2rem)] sm:w-96 z-[100] data-[expanded=true]:h-[var(--height)] focus:outline-none",
4397
- base: "pointer-events-auto absolute inset-x-0 z-[var(--index)] transform-[var(--transform)] data-[expanded=false]:data-[front=false]:h-[var(--front-height)] data-[expanded=false]:data-[front=false]:*:invisible data-[state=closed]:animate-[toast-closed_200ms_ease-in-out] data-[state=closed]:data-[expanded=false]:data-[front=false]:animate-[toast-collapsed-closed_200ms_ease-in-out] data-[swipe=move]:transition-none transition-[transform,translate,height] duration-200 ease-out"
4846
+ viewport: "fixed flex flex-col w-[calc(100%-2rem)] sm:w-96 z-[100] data-[expanded=true]:h-(--height) focus:outline-none",
4847
+ base: "pointer-events-auto absolute inset-x-0 z-(--index) transform-(--transform) data-[expanded=false]:data-[front=false]:h-(--front-height) data-[expanded=false]:data-[front=false]:*:invisible data-[state=closed]:animate-[toast-closed_200ms_ease-in-out] data-[state=closed]:data-[expanded=false]:data-[front=false]:animate-[toast-collapsed-closed_200ms_ease-in-out] data-[swipe=move]:transition-none transition-[transform,translate,height] duration-200 ease-out"
4398
4848
  },
4399
4849
  variants: {
4400
4850
  position: {
@@ -4452,14 +4902,14 @@ const toaster = {
4452
4902
  "left",
4453
4903
  "right"
4454
4904
  ],
4455
- class: "data-[swipe=move]:translate-x-[var(--reka-toast-swipe-move-x)] data-[swipe=end]:translate-x-[var(--reka-toast-swipe-end-x)] data-[swipe=cancel]:translate-x-0"
4905
+ class: "data-[swipe=move]:translate-x-(--reka-toast-swipe-move-x) data-[swipe=end]:translate-x-(--reka-toast-swipe-end-x) data-[swipe=cancel]:translate-x-0"
4456
4906
  },
4457
4907
  {
4458
4908
  swipeDirection: [
4459
4909
  "up",
4460
4910
  "down"
4461
4911
  ],
4462
- class: "data-[swipe=move]:translate-y-[var(--reka-toast-swipe-move-y)] data-[swipe=end]:translate-y-[var(--reka-toast-swipe-end-y)] data-[swipe=cancel]:translate-y-0"
4912
+ class: "data-[swipe=move]:translate-y-(--reka-toast-swipe-move-y) data-[swipe=end]:translate-y-(--reka-toast-swipe-end-y) data-[swipe=cancel]:translate-y-0"
4463
4913
  }
4464
4914
  ],
4465
4915
  defaultVariants: {
@@ -4503,8 +4953,10 @@ const theme = {
4503
4953
  formField: formField,
4504
4954
  input: input,
4505
4955
  inputMenu: inputMenu,
4956
+ inputNumber: inputNumber,
4506
4957
  kbd: kbd,
4507
4958
  link: link,
4959
+ modal: modal,
4508
4960
  progress: progress,
4509
4961
  radioGroup: radioGroup,
4510
4962
  range: range,
package/dist/unplugin.cjs CHANGED
@@ -5,7 +5,7 @@ const pathe = require('pathe');
5
5
  const unplugin = require('unplugin');
6
6
  const defu = require('defu');
7
7
  const tailwind = require('@tailwindcss/vite');
8
- const templates = require('./shared/b24ui-nuxt.DgnM0VWe.cjs');
8
+ const templates = require('./shared/b24ui-nuxt.DGjopCKm.cjs');
9
9
  const tinyglobby = require('tinyglobby');
10
10
  const knitwork = require('knitwork');
11
11
  const MagicString = require('magic-string');