@rarui/styles 1.14.0 → 1.16.0

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.
package/dist/index.d.ts CHANGED
@@ -7634,11 +7634,260 @@ export declare const iconButton: {
7634
7634
  overlay: string;
7635
7635
  };
7636
7636
  };
7637
+ declare const styles$5: {
7638
+ container: import("@vanilla-extract/recipes").RuntimeFn<{
7639
+ appearance: {
7640
+ success: {
7641
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7642
+ ":hover": {
7643
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7644
+ };
7645
+ ":focus": {
7646
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7647
+ };
7648
+ };
7649
+ error: {
7650
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7651
+ ":hover": {
7652
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7653
+ };
7654
+ ":focus": {
7655
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7656
+ };
7657
+ };
7658
+ };
7659
+ }>;
7660
+ input: import("@vanilla-extract/recipes").RuntimeFn<{
7661
+ divider: {
7662
+ false: {
7663
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7664
+ };
7665
+ };
7666
+ size: {
7667
+ large: {
7668
+ height: "3rem";
7669
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7670
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7671
+ };
7672
+ medium: {
7673
+ height: "2.75rem";
7674
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7675
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7676
+ };
7677
+ small: {
7678
+ height: "2rem";
7679
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7680
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7681
+ };
7682
+ };
7683
+ }>;
7684
+ leading: import("@vanilla-extract/recipes").RuntimeFn<{
7685
+ position: {
7686
+ start: {
7687
+ borderRightWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7688
+ };
7689
+ end: {
7690
+ borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7691
+ };
7692
+ };
7693
+ divider: {
7694
+ true: {
7695
+ borderStyle: "solid";
7696
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7697
+ };
7698
+ false: {
7699
+ borderRightWidth: number;
7700
+ borderLeftWidth: number;
7701
+ };
7702
+ };
7703
+ appearance: {
7704
+ success: {
7705
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7706
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7707
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7708
+ };
7709
+ error: {
7710
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7711
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7712
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7713
+ };
7714
+ };
7715
+ size: {
7716
+ large: {
7717
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7718
+ };
7719
+ medium: {
7720
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7721
+ };
7722
+ small: {};
7723
+ };
7724
+ }>;
7725
+ };
7726
+ export type InputVariants = RecipeVariants<typeof styles$5.container> & RecipeVariants<typeof styles$5.input>;
7727
+ export declare const input: {
7728
+ classnames: {
7729
+ container: import("@vanilla-extract/recipes").RuntimeFn<{
7730
+ appearance: {
7731
+ success: {
7732
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7733
+ ":hover": {
7734
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7735
+ };
7736
+ ":focus": {
7737
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7738
+ };
7739
+ };
7740
+ error: {
7741
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7742
+ ":hover": {
7743
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7744
+ };
7745
+ ":focus": {
7746
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7747
+ };
7748
+ };
7749
+ };
7750
+ }>;
7751
+ input: import("@vanilla-extract/recipes").RuntimeFn<{
7752
+ divider: {
7753
+ false: {
7754
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7755
+ };
7756
+ };
7757
+ size: {
7758
+ large: {
7759
+ height: "3rem";
7760
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7761
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7762
+ };
7763
+ medium: {
7764
+ height: "2.75rem";
7765
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7766
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7767
+ };
7768
+ small: {
7769
+ height: "2rem";
7770
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7771
+ lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7772
+ };
7773
+ };
7774
+ }>;
7775
+ leading: import("@vanilla-extract/recipes").RuntimeFn<{
7776
+ position: {
7777
+ start: {
7778
+ borderRightWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7779
+ };
7780
+ end: {
7781
+ borderLeftWidth: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7782
+ };
7783
+ };
7784
+ divider: {
7785
+ true: {
7786
+ borderStyle: "solid";
7787
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7788
+ };
7789
+ false: {
7790
+ borderRightWidth: number;
7791
+ borderLeftWidth: number;
7792
+ };
7793
+ };
7794
+ appearance: {
7795
+ success: {
7796
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7797
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7798
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7799
+ };
7800
+ error: {
7801
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7802
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7803
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7804
+ };
7805
+ };
7806
+ size: {
7807
+ large: {
7808
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7809
+ };
7810
+ medium: {
7811
+ padding: `var(--${string}) var(--${string})` | `var(--${string}) var(--${string}, ${string})` | `var(--${string}) var(--${string}, ${number})` | `var(--${string}, ${string}) var(--${string})` | `var(--${string}, ${string}) var(--${string}, ${string})` | `var(--${string}, ${string}) var(--${string}, ${number})` | `var(--${string}, ${number}) var(--${string})` | `var(--${string}, ${number}) var(--${string}, ${string})` | `var(--${string}, ${number}) var(--${string}, ${number})`;
7812
+ };
7813
+ small: {};
7814
+ };
7815
+ }>;
7816
+ };
7817
+ };
7818
+ declare const styles$6: {
7819
+ label: import("@vanilla-extract/recipes").RuntimeFn<{
7820
+ hidden: {
7821
+ true: {
7822
+ border: "0";
7823
+ clip: "rect(0 0 0 0)";
7824
+ height: "1px";
7825
+ margin: "-1px";
7826
+ overflow: "hidden";
7827
+ padding: "0";
7828
+ position: "absolute";
7829
+ width: "1px";
7830
+ };
7831
+ };
7832
+ }>;
7833
+ };
7834
+ export type LabelVariants = RecipeVariants<typeof styles$6.label>;
7835
+ export declare const label: {
7836
+ classnames: {
7837
+ label: import("@vanilla-extract/recipes").RuntimeFn<{
7838
+ hidden: {
7839
+ true: {
7840
+ border: "0";
7841
+ clip: "rect(0 0 0 0)";
7842
+ height: "1px";
7843
+ margin: "-1px";
7844
+ overflow: "hidden";
7845
+ padding: "0";
7846
+ position: "absolute";
7847
+ width: "1px";
7848
+ };
7849
+ };
7850
+ }>;
7851
+ };
7852
+ };
7853
+ declare const styles$7: {
7854
+ link: import("@vanilla-extract/recipes").RuntimeFn<{
7855
+ appearance: {
7856
+ brand: {
7857
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7858
+ };
7859
+ neutral: {
7860
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7861
+ };
7862
+ inverted: {
7863
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7864
+ };
7865
+ };
7866
+ size: {
7867
+ large: {
7868
+ fontSize: "1.125rem";
7869
+ lineHeight: "1.75rem";
7870
+ letterSpacing: ".0112rem";
7871
+ };
7872
+ small: {
7873
+ fontSize: ".875rem";
7874
+ lineHeight: "1.25rem";
7875
+ letterSpacing: ".0088rem";
7876
+ };
7877
+ medium: {
7878
+ fontSize: "1rem";
7879
+ lineHeight: "1.5rem";
7880
+ letterSpacing: ".01rem";
7881
+ };
7882
+ };
7883
+ }>;
7884
+ };
7885
+ export type LinkVariants = RecipeVariants<typeof styles$7.link>;
7637
7886
  export declare const link: {
7638
7887
  classnames: {
7639
7888
  link: import("@vanilla-extract/recipes").RuntimeFn<{
7640
7889
  appearance: {
7641
- default: {
7890
+ brand: {
7642
7891
  color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7643
7892
  };
7644
7893
  neutral: {
@@ -7668,6 +7917,125 @@ export declare const link: {
7668
7917
  }>;
7669
7918
  };
7670
7919
  };
7920
+ declare const styles$8: {
7921
+ radioButton: import("@vanilla-extract/recipes").RuntimeFn<{
7922
+ size: {
7923
+ small: {
7924
+ width: "1.25rem";
7925
+ height: "1.25rem";
7926
+ ":before": {
7927
+ width: "2rem";
7928
+ height: "2rem";
7929
+ };
7930
+ ":after": {
7931
+ width: ".5rem";
7932
+ height: ".5rem";
7933
+ };
7934
+ };
7935
+ large: {
7936
+ width: "1.5rem";
7937
+ height: "1.5rem";
7938
+ ":before": {
7939
+ width: "2.75rem";
7940
+ height: "2.75rem";
7941
+ };
7942
+ ":after": {
7943
+ width: ".75rem";
7944
+ height: ".75rem";
7945
+ };
7946
+ };
7947
+ };
7948
+ error: {
7949
+ true: {
7950
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7951
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7952
+ selectors: {
7953
+ "&:has(input:disabled)": {
7954
+ opacity: "50%";
7955
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7956
+ };
7957
+ "&:has(input:checked)": {
7958
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7959
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7960
+ };
7961
+ "&:has(input:checked):after": {
7962
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7963
+ };
7964
+ "&:hover:before": {
7965
+ opacity: number;
7966
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7967
+ };
7968
+ "&:active:before": {
7969
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7970
+ };
7971
+ };
7972
+ };
7973
+ };
7974
+ }>;
7975
+ input: string;
7976
+ container: string;
7977
+ };
7978
+ export type RadioButtonVariants = RecipeVariants<typeof styles$8.radioButton>;
7979
+ export declare const radioButton: {
7980
+ classnames: {
7981
+ radioButton: import("@vanilla-extract/recipes").RuntimeFn<{
7982
+ size: {
7983
+ small: {
7984
+ width: "1.25rem";
7985
+ height: "1.25rem";
7986
+ ":before": {
7987
+ width: "2rem";
7988
+ height: "2rem";
7989
+ };
7990
+ ":after": {
7991
+ width: ".5rem";
7992
+ height: ".5rem";
7993
+ };
7994
+ };
7995
+ large: {
7996
+ width: "1.5rem";
7997
+ height: "1.5rem";
7998
+ ":before": {
7999
+ width: "2.75rem";
8000
+ height: "2.75rem";
8001
+ };
8002
+ ":after": {
8003
+ width: ".75rem";
8004
+ height: ".75rem";
8005
+ };
8006
+ };
8007
+ };
8008
+ error: {
8009
+ true: {
8010
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8011
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8012
+ selectors: {
8013
+ "&:has(input:disabled)": {
8014
+ opacity: "50%";
8015
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8016
+ };
8017
+ "&:has(input:checked)": {
8018
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8019
+ borderColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8020
+ };
8021
+ "&:has(input:checked):after": {
8022
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8023
+ };
8024
+ "&:hover:before": {
8025
+ opacity: number;
8026
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8027
+ };
8028
+ "&:active:before": {
8029
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8030
+ };
8031
+ };
8032
+ };
8033
+ };
8034
+ }>;
8035
+ input: string;
8036
+ container: string;
8037
+ };
8038
+ };
7671
8039
  export type SkeletonDynamicProperties = Pick<StandardLonghandProperties, "width" | "height" | "maxWidth" | "maxHeight" | "minWidth" | "minHeight">;
7672
8040
  export interface SkeletonSprinkle extends SkeletonDynamicProperties {
7673
8041
  /**
@@ -7786,7 +8154,7 @@ export declare const skeleton: {
7786
8154
  }
7787
8155
  ]>;
7788
8156
  };
7789
- declare const styles$5: {
8157
+ declare const styles$9: {
7790
8158
  status: import("@vanilla-extract/recipes").RuntimeFn<{
7791
8159
  appearance: {
7792
8160
  success: {
@@ -7839,7 +8207,7 @@ declare const styles$5: {
7839
8207
  };
7840
8208
  }>;
7841
8209
  };
7842
- export type StatusVariants = RecipeVariants<typeof styles$5.status>;
8210
+ export type StatusVariants = RecipeVariants<typeof styles$9.status>;
7843
8211
  declare const status$1: {
7844
8212
  classnames: {
7845
8213
  status: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -8479,7 +8847,7 @@ export declare const title: {
8479
8847
  }
8480
8848
  ]>;
8481
8849
  };
8482
- declare const styles$6: {
8850
+ declare const styles$10: {
8483
8851
  banner: import("@vanilla-extract/recipes").RuntimeFn<{
8484
8852
  appearance: {
8485
8853
  brand: {
@@ -8514,7 +8882,7 @@ declare const styles$6: {
8514
8882
  };
8515
8883
  }>;
8516
8884
  };
8517
- export type BannerVariants = RecipeVariants<typeof styles$6.banner>;
8885
+ export type BannerVariants = RecipeVariants<typeof styles$10.banner>;
8518
8886
  export declare const banner: {
8519
8887
  classnames: {
8520
8888
  banner: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -8552,7 +8920,7 @@ export declare const banner: {
8552
8920
  }>;
8553
8921
  };
8554
8922
  };
8555
- declare const styles$7: {
8923
+ declare const styles$11: {
8556
8924
  toast: import("@vanilla-extract/recipes").RuntimeFn<{
8557
8925
  placement: {
8558
8926
  topRight: {};
@@ -8681,7 +9049,7 @@ declare const styles$7: {
8681
9049
  };
8682
9050
  }>;
8683
9051
  };
8684
- export type ToastVariants = RecipeVariants<typeof styles$7.toast>;
9052
+ export type ToastVariants = RecipeVariants<typeof styles$11.toast>;
8685
9053
  export declare const toast: {
8686
9054
  classnames: {
8687
9055
  toast: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -8813,7 +9181,7 @@ export declare const toast: {
8813
9181
  }>;
8814
9182
  };
8815
9183
  };
8816
- declare const styles$8: {
9184
+ declare const styles$12: {
8817
9185
  toggle: import("@vanilla-extract/recipes").RuntimeFn<{
8818
9186
  size: {
8819
9187
  large: {
@@ -8882,7 +9250,7 @@ declare const styles$8: {
8882
9250
  };
8883
9251
  }>;
8884
9252
  };
8885
- export type ToggleVariants = RecipeVariants<typeof styles$8.toggle>;
9253
+ export type ToggleVariants = RecipeVariants<typeof styles$12.toggle>;
8886
9254
  export declare const toggle: {
8887
9255
  classnames: {
8888
9256
  toggle: import("@vanilla-extract/recipes").RuntimeFn<{