@bitrix24/b24ui-nuxt 0.2.3 → 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.
@@ -2692,6 +2692,404 @@ const inputMenu = () => {
2692
2692
  }, input);
2693
2693
  };
2694
2694
 
2695
+ const inputNumber = () => {
2696
+ const input$1 = input;
2697
+ return {
2698
+ slots: {
2699
+ root: "relative inline-flex items-center",
2700
+ base: [
2701
+ "w-full py-0 border-0 focus:outline-none disabled:cursor-not-allowed disabled:opacity-75",
2702
+ "placeholder:text-base-400",
2703
+ "dark:placeholder:text-base-300",
2704
+ "appearance-none transition duration-300 ease-linear",
2705
+ // transition-colors
2706
+ "ring ring-inset ring-base-300",
2707
+ "dark:ring-base-800",
2708
+ "text-base-master bg-white placeholder:text-base-400 hover:text-base-900 focus:text-base-900 active:text-base-900",
2709
+ "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",
2710
+ "font-b24-primary font-regular text-md leading-none",
2711
+ "align-middle",
2712
+ "text-ellipsis whitespace-nowrap"
2713
+ ].join(" "),
2714
+ increment: "absolute flex items-center",
2715
+ decrement: "absolute flex items-center",
2716
+ tag: input$1.slots.tag
2717
+ },
2718
+ variants: {
2719
+ size: {
2720
+ xs: "px-2 h-xl2 gap-1",
2721
+ sm: "px-2.5 h-8 gap-1.5",
2722
+ md: "px-2.5 h-10 gap-1.5",
2723
+ lg: "px-3 h-12 gap-2"
2724
+ },
2725
+ color: {
2726
+ default: "",
2727
+ danger: "",
2728
+ success: "",
2729
+ warning: "",
2730
+ primary: "",
2731
+ secondary: "",
2732
+ collab: "",
2733
+ ai: ""
2734
+ },
2735
+ tagColor: {
2736
+ ...input$1.variants.tagColor
2737
+ },
2738
+ rounded: {
2739
+ ...input$1.variants.rounded
2740
+ },
2741
+ noPadding: {
2742
+ ...input$1.variants.noPadding
2743
+ },
2744
+ noBorder: {
2745
+ ...input$1.variants.noBorder
2746
+ },
2747
+ underline: {
2748
+ ...input$1.variants.underline
2749
+ },
2750
+ disabled: {
2751
+ true: {
2752
+ increment: "opacity-75 cursor-not-allowed",
2753
+ decrement: "opacity-75 cursor-not-allowed"
2754
+ }
2755
+ },
2756
+ orientation: {
2757
+ horizontal: {
2758
+ base: "text-center",
2759
+ increment: "inset-y-0 end-0 py-0 pe-0 [&>button]:p-1",
2760
+ decrement: "inset-y-0 start-0 py-0 ps-0 [&>button]:p-1"
2761
+ },
2762
+ vertical: {
2763
+ increment: "top-1 end-0 pe-1 [&>button]:p-0",
2764
+ decrement: "bottom-1 end-0 pe-1 [&>button]:p-0"
2765
+ }
2766
+ },
2767
+ highlight: {
2768
+ true: ""
2769
+ }
2770
+ },
2771
+ compoundVariants: [
2772
+ // region ring for focus and highlight ////
2773
+ // region default ////
2774
+ {
2775
+ color: "default",
2776
+ noBorder: false,
2777
+ underline: false,
2778
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-base-900 dark:focus-visible:ring-base-350"
2779
+ },
2780
+ {
2781
+ color: "default",
2782
+ highlight: true,
2783
+ noBorder: false,
2784
+ underline: false,
2785
+ class: "ring ring-inset ring-base-900 dark:ring-base-350"
2786
+ },
2787
+ {
2788
+ color: "default",
2789
+ noBorder: false,
2790
+ underline: true,
2791
+ class: "focus-visible:border-base-900 dark:focus-visible:border-b-base-350"
2792
+ },
2793
+ {
2794
+ color: "default",
2795
+ highlight: true,
2796
+ noBorder: false,
2797
+ underline: true,
2798
+ class: "border-b-base-900 dark:border-b-base-350"
2799
+ },
2800
+ // endregion ////
2801
+ // region danger ////
2802
+ {
2803
+ color: "danger",
2804
+ noBorder: false,
2805
+ underline: false,
2806
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-red-500 dark:focus-visible:ring-red-600"
2807
+ },
2808
+ {
2809
+ color: "danger",
2810
+ highlight: true,
2811
+ noBorder: false,
2812
+ underline: false,
2813
+ class: "ring ring-inset ring-red-500 dark:ring-red-600"
2814
+ },
2815
+ {
2816
+ color: "danger",
2817
+ noBorder: false,
2818
+ underline: true,
2819
+ class: "focus-visible:border-b-red-500 dark:focus-visible:border-b-red-600"
2820
+ },
2821
+ {
2822
+ color: "danger",
2823
+ highlight: true,
2824
+ noBorder: false,
2825
+ underline: true,
2826
+ class: "border-b-red-500 dark:border-b-red-600"
2827
+ },
2828
+ // endregion ////
2829
+ // region success ////
2830
+ {
2831
+ color: "success",
2832
+ noBorder: false,
2833
+ underline: false,
2834
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-green-500 dark:focus-visible:ring-green-600"
2835
+ },
2836
+ {
2837
+ color: "success",
2838
+ highlight: true,
2839
+ noBorder: false,
2840
+ underline: false,
2841
+ class: "ring ring-inset ring-green-500 dark:ring-green-600"
2842
+ },
2843
+ {
2844
+ color: "success",
2845
+ noBorder: false,
2846
+ underline: true,
2847
+ class: "focus-visible:border-b-green-500 dark:focus-visible:border-b-green-600"
2848
+ },
2849
+ {
2850
+ color: "success",
2851
+ highlight: true,
2852
+ noBorder: false,
2853
+ underline: true,
2854
+ class: "border-b-green-500 dark:border-b-green-600"
2855
+ },
2856
+ // endregion ////
2857
+ // region warning ////
2858
+ {
2859
+ color: "warning",
2860
+ noBorder: false,
2861
+ underline: false,
2862
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-orange-500 dark:focus-visible:ring-orange-600"
2863
+ },
2864
+ {
2865
+ color: "warning",
2866
+ highlight: true,
2867
+ noBorder: false,
2868
+ underline: false,
2869
+ class: "ring ring-inset ring-orange-500 dark:ring-orange-600"
2870
+ },
2871
+ {
2872
+ color: "warning",
2873
+ noBorder: false,
2874
+ underline: true,
2875
+ class: "focus-visible:border-b-orange-500 dark:focus-visible:border-b-orange-600"
2876
+ },
2877
+ {
2878
+ color: "warning",
2879
+ highlight: true,
2880
+ noBorder: false,
2881
+ underline: true,
2882
+ class: "border-b-orange-500 dark:border-b-orange-600"
2883
+ },
2884
+ // endregion ////
2885
+ // region primary ////
2886
+ {
2887
+ color: "primary",
2888
+ noBorder: false,
2889
+ underline: false,
2890
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-blue-500 dark:focus-visible:ring-blue-600"
2891
+ },
2892
+ {
2893
+ color: "primary",
2894
+ highlight: true,
2895
+ noBorder: false,
2896
+ underline: false,
2897
+ class: "ring ring-inset ring-blue-500 dark:ring-blue-600"
2898
+ },
2899
+ {
2900
+ color: "primary",
2901
+ noBorder: false,
2902
+ underline: true,
2903
+ class: "focus-visible:border-b-blue-500 dark:focus-visible:border-b-blue-600"
2904
+ },
2905
+ {
2906
+ color: "primary",
2907
+ highlight: true,
2908
+ noBorder: false,
2909
+ underline: true,
2910
+ class: "border-b-blue-500 dark:border-b-blue-600"
2911
+ },
2912
+ // endregion ////
2913
+ // region secondary ////
2914
+ {
2915
+ color: "secondary",
2916
+ noBorder: false,
2917
+ underline: false,
2918
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-cyan-500 dark:focus-visible:ring-cyan-600"
2919
+ },
2920
+ {
2921
+ color: "secondary",
2922
+ highlight: true,
2923
+ noBorder: false,
2924
+ underline: false,
2925
+ class: "ring ring-inset ring-cyan-500 dark:ring-cyan-600"
2926
+ },
2927
+ {
2928
+ color: "secondary",
2929
+ noBorder: false,
2930
+ underline: true,
2931
+ class: "focus-visible:border-b-cyan-500 dark:focus-visible:border-b-cyan-600"
2932
+ },
2933
+ {
2934
+ color: "secondary",
2935
+ highlight: true,
2936
+ noBorder: false,
2937
+ underline: true,
2938
+ class: "border-b-cyan-500 dark:border-b-cyan-600"
2939
+ },
2940
+ // endregion ////
2941
+ // region collab ////
2942
+ {
2943
+ color: "collab",
2944
+ noBorder: false,
2945
+ underline: false,
2946
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-collab-500 dark:focus-visible:ring-collab-600"
2947
+ },
2948
+ {
2949
+ color: "collab",
2950
+ highlight: true,
2951
+ noBorder: false,
2952
+ underline: false,
2953
+ class: "ring ring-inset ring-collab-500 dark:ring-collab-600"
2954
+ },
2955
+ {
2956
+ color: "collab",
2957
+ noBorder: false,
2958
+ underline: true,
2959
+ class: "focus-visible:border-b-collab-500 dark:focus-visible:border-b-collab-600"
2960
+ },
2961
+ {
2962
+ color: "collab",
2963
+ highlight: true,
2964
+ noBorder: false,
2965
+ underline: true,
2966
+ class: "border-b-collab-500 dark:border-b-collab-600"
2967
+ },
2968
+ // endregion ////
2969
+ // region ai ////
2970
+ {
2971
+ color: "ai",
2972
+ noBorder: false,
2973
+ underline: false,
2974
+ class: "focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ai-500 dark:focus-visible:ring-ai-600"
2975
+ },
2976
+ {
2977
+ color: "ai",
2978
+ highlight: true,
2979
+ noBorder: false,
2980
+ underline: false,
2981
+ class: "ring ring-inset ring-ai-500 dark:ring-ai-600"
2982
+ },
2983
+ {
2984
+ color: "ai",
2985
+ noBorder: false,
2986
+ underline: true,
2987
+ class: "focus-visible:border-b-ai-500 dark:focus-visible:border-b-ai-600"
2988
+ },
2989
+ {
2990
+ color: "ai",
2991
+ highlight: true,
2992
+ noBorder: false,
2993
+ underline: true,
2994
+ class: "border-b-ai-500 dark:border-b-ai-600"
2995
+ },
2996
+ // endregion ////
2997
+ // endregion ////
2998
+ // region orientation && size ////
2999
+ // region horizontal ////
3000
+ {
3001
+ orientation: "horizontal",
3002
+ rounded: true,
3003
+ class: {
3004
+ increment: "[&>button]:rounded-3xl",
3005
+ decrement: "[&>button]:rounded-3xl"
3006
+ }
3007
+ },
3008
+ {
3009
+ orientation: "horizontal",
3010
+ size: "xs",
3011
+ class: {
3012
+ base: "px-[1.3rem]",
3013
+ increment: "[&>button]:h-[24px] scale-80",
3014
+ decrement: "[&>button]:h-[24px] scale-80"
3015
+ }
3016
+ },
3017
+ {
3018
+ orientation: "horizontal",
3019
+ size: "sm",
3020
+ class: {
3021
+ base: "px-[2.1rem]",
3022
+ increment: "scale-80",
3023
+ decrement: "scale-80"
3024
+ }
3025
+ },
3026
+ {
3027
+ orientation: "horizontal",
3028
+ size: "md",
3029
+ class: {
3030
+ base: "px-[2.45rem]",
3031
+ increment: "[&>button]:p-1.5 scale-80",
3032
+ decrement: "[&>button]:p-1.5 scale-80"
3033
+ }
3034
+ },
3035
+ {
3036
+ orientation: "horizontal",
3037
+ size: "lg",
3038
+ class: {
3039
+ base: "px-[2.95rem]",
3040
+ increment: "pe-1 [&>button]:p-1.5 [&>button]:h-[42px] scale-95",
3041
+ decrement: "ps-1 [&>button]:p-1.5 [&>button]:h-[42px] scale-95"
3042
+ }
3043
+ },
3044
+ // endregion ////
3045
+ // region vertical ////
3046
+ {
3047
+ orientation: "vertical",
3048
+ size: "xs",
3049
+ class: {
3050
+ base: "pe-7",
3051
+ increment: "top-0 pe-0 [&>button]:h-[13px]",
3052
+ decrement: "bottom-0 pe-0 [&>button]:h-[13px]"
3053
+ }
3054
+ },
3055
+ {
3056
+ orientation: "vertical",
3057
+ size: "sm",
3058
+ class: {
3059
+ base: "pe-8",
3060
+ increment: "[&>button]:h-[13px] scale-80",
3061
+ decrement: "[&>button]:h-[13px] scale-80"
3062
+ }
3063
+ },
3064
+ {
3065
+ orientation: "vertical",
3066
+ size: "md",
3067
+ class: {
3068
+ base: "pe-9",
3069
+ increment: "[&>button]:h-[19px] scale-80",
3070
+ decrement: "[&>button]:h-[19px] scale-80"
3071
+ }
3072
+ },
3073
+ {
3074
+ orientation: "vertical",
3075
+ size: "lg",
3076
+ class: {
3077
+ base: "pe-9",
3078
+ increment: "[&>button]:h-[22px] scale-80",
3079
+ decrement: "[&>button]:h-[22px] scale-80"
3080
+ }
3081
+ }
3082
+ // endregion ////
3083
+ // endregion ////
3084
+ ],
3085
+ defaultVariants: {
3086
+ size: "md",
3087
+ color: "primary",
3088
+ tagColor: "primary"
3089
+ }
3090
+ };
3091
+ };
3092
+
2695
3093
  const kbd = {
2696
3094
  base: "inline-flex items-center justify-center px-1 rounded-2xs font-normal font-b24-system-mono",
2697
3095
  variants: {
@@ -4557,6 +4955,7 @@ const theme = {
4557
4955
  formField: formField,
4558
4956
  input: input,
4559
4957
  inputMenu: inputMenu,
4958
+ inputNumber: inputNumber,
4560
4959
  kbd: kbd,
4561
4960
  link: link,
4562
4961
  modal: modal,