@rarui/styles 1.31.0-rc.6 → 1.31.0-rc.7

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
@@ -4122,16 +4122,6 @@ declare const backgroundColorProperties: {
4122
4122
  "invert-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4123
4123
  "invert-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4124
4124
  "invert-secondary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4125
- "on-brand-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4126
- "on-brand-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4127
- "on-error-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4128
- "on-error-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4129
- "on-info-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4130
- "on-info-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4131
- "on-success-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4132
- "on-success-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4133
- "on-warning-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4134
- "on-warning-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4135
4125
  overlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4136
4126
  press: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4137
4127
  primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -4443,46 +4433,6 @@ export declare const box: {
4443
4433
  default: string;
4444
4434
  conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4445
4435
  };
4446
- "on-brand-hover": {
4447
- default: string;
4448
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4449
- };
4450
- "on-brand-press": {
4451
- default: string;
4452
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4453
- };
4454
- "on-error-hover": {
4455
- default: string;
4456
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4457
- };
4458
- "on-error-press": {
4459
- default: string;
4460
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4461
- };
4462
- "on-info-hover": {
4463
- default: string;
4464
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4465
- };
4466
- "on-info-press": {
4467
- default: string;
4468
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4469
- };
4470
- "on-success-hover": {
4471
- default: string;
4472
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4473
- };
4474
- "on-success-press": {
4475
- default: string;
4476
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4477
- };
4478
- "on-warning-hover": {
4479
- default: string;
4480
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4481
- };
4482
- "on-warning-press": {
4483
- default: string;
4484
- conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
4485
- };
4486
4436
  overlay: {
4487
4437
  default: string;
4488
4438
  conditions: Record<"disabled" | "hover" | "xs" | "xl" | "md" | "lg" | "active" | "focus" | "focusWithin", string>;
@@ -4558,16 +4508,6 @@ export declare const box: {
4558
4508
  "invert-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4559
4509
  "invert-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4560
4510
  "invert-secondary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4561
- "on-brand-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4562
- "on-brand-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4563
- "on-error-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4564
- "on-error-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4565
- "on-info-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4566
- "on-info-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4567
- "on-success-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4568
- "on-success-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4569
- "on-warning-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4570
- "on-warning-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4571
4511
  overlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4572
4512
  press: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4573
4513
  primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -9004,8 +8944,42 @@ declare const selectStyles: {
9004
8944
  list: string;
9005
8945
  close: string;
9006
8946
  };
8947
+ declare const dropdownStyles: {
8948
+ dropdown: import("@vanilla-extract/recipes").RuntimeFn<{
8949
+ /**
8950
+ * Specifies the padding inside the dropdown menu. This prop accepts one of the following values: "base" or "none".
8951
+ * @default base
8952
+ */
8953
+ padding: {
8954
+ base: {
8955
+ padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8956
+ };
8957
+ none: {
8958
+ padding: number;
8959
+ };
8960
+ };
8961
+ }>;
8962
+ dropdownItem: import("@vanilla-extract/recipes").RuntimeFn<{
8963
+ selected: {
8964
+ true: {
8965
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8966
+ ":hover": {
8967
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8968
+ };
8969
+ };
8970
+ };
8971
+ }>;
8972
+ };
8973
+ export type DropdownVariants = NonNullable<RecipeVariants<typeof dropdownStyles.dropdown> & RecipeVariants<typeof dropdownStyles.dropdownItem>>;
8974
+ export type DropdownDynamicProperties = Pick<StandardLonghandProperties, "width" | "maxWidth">;
8975
+ export interface DropdownSprinkle extends DropdownDynamicProperties {
8976
+ /**
8977
+ * The zIndex property specifies the stack order of the box.
8978
+ */
8979
+ zIndex?: AddDollar<keyof typeof zIndexProperties> | Conditions<AddDollar<keyof typeof zIndexProperties>>;
8980
+ }
9007
8981
  export type SelectVariants = NonNullable<RecipeVariants<typeof selectStyles.select>>;
9008
- export type SelectSprinkle = Pick<StandardLonghandProperties, "maxHeight">;
8982
+ export type SelectSprinkle = Pick<StandardLonghandProperties, "maxHeight"> & Pick<DropdownSprinkle, "zIndex">;
9009
8983
  export declare const select: {
9010
8984
  classnames: {
9011
8985
  select: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -10688,46 +10662,6 @@ export declare const card: {
10688
10662
  default: string;
10689
10663
  conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10690
10664
  };
10691
- "on-brand-hover": {
10692
- default: string;
10693
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10694
- };
10695
- "on-brand-press": {
10696
- default: string;
10697
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10698
- };
10699
- "on-error-hover": {
10700
- default: string;
10701
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10702
- };
10703
- "on-error-press": {
10704
- default: string;
10705
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10706
- };
10707
- "on-info-hover": {
10708
- default: string;
10709
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10710
- };
10711
- "on-info-press": {
10712
- default: string;
10713
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10714
- };
10715
- "on-success-hover": {
10716
- default: string;
10717
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10718
- };
10719
- "on-success-press": {
10720
- default: string;
10721
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10722
- };
10723
- "on-warning-hover": {
10724
- default: string;
10725
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10726
- };
10727
- "on-warning-press": {
10728
- default: string;
10729
- conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10730
- };
10731
10665
  overlay: {
10732
10666
  default: string;
10733
10667
  conditions: Record<"xs" | "xl" | "md" | "lg", string>;
@@ -10803,16 +10737,6 @@ export declare const card: {
10803
10737
  "invert-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10804
10738
  "invert-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10805
10739
  "invert-secondary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10806
- "on-brand-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10807
- "on-brand-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10808
- "on-error-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10809
- "on-error-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10810
- "on-info-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10811
- "on-info-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10812
- "on-success-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10813
- "on-success-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10814
- "on-warning-hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10815
- "on-warning-press": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10816
10740
  overlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10817
10741
  press: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10818
10742
  primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -10840,34 +10764,6 @@ export declare const datepicker: {
10840
10764
  time: string;
10841
10765
  };
10842
10766
  };
10843
- declare const dropdownStyles: {
10844
- dropdown: import("@vanilla-extract/recipes").RuntimeFn<{
10845
- /**
10846
- * Specifies the padding inside the dropdown menu. This prop accepts one of the following values: "base" or "none".
10847
- * @default base
10848
- */
10849
- padding: {
10850
- base: {
10851
- padding: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10852
- };
10853
- none: {
10854
- padding: number;
10855
- };
10856
- };
10857
- }>;
10858
- dropdownItem: import("@vanilla-extract/recipes").RuntimeFn<{
10859
- selected: {
10860
- true: {
10861
- backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10862
- ":hover": {
10863
- backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10864
- };
10865
- };
10866
- };
10867
- }>;
10868
- };
10869
- export type DropdownVariants = NonNullable<RecipeVariants<typeof dropdownStyles.dropdown> & RecipeVariants<typeof dropdownStyles.dropdownItem>>;
10870
- export type DropdownSprinkle = Pick<StandardLonghandProperties, "width" | "maxWidth">;
10871
10767
  export declare const dropdown: {
10872
10768
  classnames: {
10873
10769
  dropdown: import("@vanilla-extract/recipes").RuntimeFn<{
@@ -10893,6 +10789,61 @@ export declare const dropdown: {
10893
10789
  };
10894
10790
  sprinkle: import("rainbow-sprinkles/dist/declarations/src/createRuntimeFn").SprinklesFn<[
10895
10791
  {
10792
+ config: {
10793
+ zIndex: {
10794
+ values: {
10795
+ 100: {
10796
+ default: string;
10797
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10798
+ };
10799
+ 200: {
10800
+ default: string;
10801
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10802
+ };
10803
+ 300: {
10804
+ default: string;
10805
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10806
+ };
10807
+ 400: {
10808
+ default: string;
10809
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10810
+ };
10811
+ 500: {
10812
+ default: string;
10813
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10814
+ };
10815
+ 600: {
10816
+ default: string;
10817
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10818
+ };
10819
+ 700: {
10820
+ default: string;
10821
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10822
+ };
10823
+ 800: {
10824
+ default: string;
10825
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10826
+ };
10827
+ 900: {
10828
+ default: string;
10829
+ conditions: Record<"xs" | "xl" | "md" | "lg", string>;
10830
+ };
10831
+ };
10832
+ staticScale: {
10833
+ "100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10834
+ "200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10835
+ "300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10836
+ "400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10837
+ "500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10838
+ "600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10839
+ "700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10840
+ "800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10841
+ "900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
10842
+ };
10843
+ name: "zIndex";
10844
+ };
10845
+ };
10846
+ } & {
10896
10847
  config: {
10897
10848
  width: {
10898
10849
  dynamic: {