@rehagro/ui 1.0.36 → 1.0.38

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.
@@ -1,4 +1,4 @@
1
- type PresetColor = "primary" | "secondary" | "danger" | "warning" | "success" | "info";
1
+ type PresetColor = "primary" | "secondary" | "danger" | "warning" | "success" | "info" | "neutral";
2
2
  type ButtonColor = PresetColor | (string & {});
3
3
 
4
4
  export type { ButtonColor as B, PresetColor as P };
@@ -1,4 +1,4 @@
1
- type PresetColor = "primary" | "secondary" | "danger" | "warning" | "success" | "info";
1
+ type PresetColor = "primary" | "secondary" | "danger" | "warning" | "success" | "info" | "neutral";
2
2
  type ButtonColor = PresetColor | (string & {});
3
3
 
4
4
  export type { ButtonColor as B, PresetColor as P };
package/dist/index.d.mts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React__default from 'react';
3
- import { B as ButtonColor, P as PresetColor } from './colors.types-7nLOoy6r.mjs';
3
+ import { B as ButtonColor, P as PresetColor } from './colors.types-Dd3I7svd.mjs';
4
4
 
5
5
  type ToastVariant = "info" | "warning" | "success" | "error" | "neutral";
6
6
  type ToastAppearance = "solid" | "light" | "outline";
@@ -91,6 +91,10 @@ type RehagroTheme = {
91
91
  successHover?: string;
92
92
  info?: string;
93
93
  infoHover?: string;
94
+ /** Neutral color — for non-semantic actions (e.g. kebab menus, close buttons).
95
+ * Typically mapped to textMuted / text / border in the consumer's theme. */
96
+ neutral?: string;
97
+ neutralHover?: string;
94
98
  /** Subtle background for outline/ghost hover.
95
99
  * Accepts any CSS color value (hex, rgb, named).
96
100
  * When omitted, derived automatically via color-mix from the base color. */
@@ -100,6 +104,7 @@ type RehagroTheme = {
100
104
  warningSubtle?: string;
101
105
  successSubtle?: string;
102
106
  infoSubtle?: string;
107
+ neutralSubtle?: string;
103
108
  /** Semantic colors */
104
109
  text?: string;
105
110
  textMuted?: string;
@@ -126,6 +131,8 @@ type RehagroTheme = {
126
131
  inputPxMd?: string;
127
132
  inputPxLg?: string;
128
133
  /** Button heights */
134
+ buttonHeightXxs?: string;
135
+ buttonHeightXs?: string;
129
136
  buttonHeightSm?: string;
130
137
  buttonHeightMd?: string;
131
138
  buttonHeightLg?: string;
@@ -145,7 +152,7 @@ type RehagroProviderProps = {
145
152
  declare function RehagroProvider({ theme, toastPosition, children }: RehagroProviderProps): react_jsx_runtime.JSX.Element;
146
153
 
147
154
  type ButtonVariant = "solid" | "outline" | "ghost";
148
- type ButtonSize = "sm" | "md" | "lg" | "xl";
155
+ type ButtonSize = "xxs" | "xs" | "sm" | "md" | "lg" | "xl";
149
156
  type ButtonRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
150
157
  type ButtonHoverStyle = {
151
158
  /** Background on hover */
@@ -199,7 +206,7 @@ declare const Button: React__default.ForwardRefExoticComponent<React__default.Bu
199
206
  } & React__default.RefAttributes<HTMLButtonElement>>;
200
207
 
201
208
  type IconButtonVariant = "solid" | "outline" | "ghost";
202
- type IconButtonSize = "sm" | "md" | "lg";
209
+ type IconButtonSize = "xxs" | "xs" | "sm" | "md" | "lg";
203
210
  type IconButtonRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
204
211
  type IconButtonColor = ButtonColor;
205
212
  type IconButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & {
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React__default from 'react';
3
- import { B as ButtonColor, P as PresetColor } from './colors.types-7nLOoy6r.js';
3
+ import { B as ButtonColor, P as PresetColor } from './colors.types-Dd3I7svd.js';
4
4
 
5
5
  type ToastVariant = "info" | "warning" | "success" | "error" | "neutral";
6
6
  type ToastAppearance = "solid" | "light" | "outline";
@@ -91,6 +91,10 @@ type RehagroTheme = {
91
91
  successHover?: string;
92
92
  info?: string;
93
93
  infoHover?: string;
94
+ /** Neutral color — for non-semantic actions (e.g. kebab menus, close buttons).
95
+ * Typically mapped to textMuted / text / border in the consumer's theme. */
96
+ neutral?: string;
97
+ neutralHover?: string;
94
98
  /** Subtle background for outline/ghost hover.
95
99
  * Accepts any CSS color value (hex, rgb, named).
96
100
  * When omitted, derived automatically via color-mix from the base color. */
@@ -100,6 +104,7 @@ type RehagroTheme = {
100
104
  warningSubtle?: string;
101
105
  successSubtle?: string;
102
106
  infoSubtle?: string;
107
+ neutralSubtle?: string;
103
108
  /** Semantic colors */
104
109
  text?: string;
105
110
  textMuted?: string;
@@ -126,6 +131,8 @@ type RehagroTheme = {
126
131
  inputPxMd?: string;
127
132
  inputPxLg?: string;
128
133
  /** Button heights */
134
+ buttonHeightXxs?: string;
135
+ buttonHeightXs?: string;
129
136
  buttonHeightSm?: string;
130
137
  buttonHeightMd?: string;
131
138
  buttonHeightLg?: string;
@@ -145,7 +152,7 @@ type RehagroProviderProps = {
145
152
  declare function RehagroProvider({ theme, toastPosition, children }: RehagroProviderProps): react_jsx_runtime.JSX.Element;
146
153
 
147
154
  type ButtonVariant = "solid" | "outline" | "ghost";
148
- type ButtonSize = "sm" | "md" | "lg" | "xl";
155
+ type ButtonSize = "xxs" | "xs" | "sm" | "md" | "lg" | "xl";
149
156
  type ButtonRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
150
157
  type ButtonHoverStyle = {
151
158
  /** Background on hover */
@@ -199,7 +206,7 @@ declare const Button: React__default.ForwardRefExoticComponent<React__default.Bu
199
206
  } & React__default.RefAttributes<HTMLButtonElement>>;
200
207
 
201
208
  type IconButtonVariant = "solid" | "outline" | "ghost";
202
- type IconButtonSize = "sm" | "md" | "lg";
209
+ type IconButtonSize = "xxs" | "xs" | "sm" | "md" | "lg";
203
210
  type IconButtonRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
204
211
  type IconButtonColor = ButtonColor;
205
212
  type IconButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & {
package/dist/index.js CHANGED
@@ -24,12 +24,15 @@ var TOKEN_MAP = {
24
24
  successHover: { var: "--rh-success-hover", isColor: true },
25
25
  info: { var: "--rh-info", isColor: true },
26
26
  infoHover: { var: "--rh-info-hover", isColor: true },
27
+ neutral: { var: "--rh-neutral", isColor: true },
28
+ neutralHover: { var: "--rh-neutral-hover", isColor: true },
27
29
  primarySubtle: { var: "--rh-primary-subtle", isColor: true, raw: true },
28
30
  secondarySubtle: { var: "--rh-secondary-subtle", isColor: true, raw: true },
29
31
  dangerSubtle: { var: "--rh-danger-subtle", isColor: true, raw: true },
30
32
  warningSubtle: { var: "--rh-warning-subtle", isColor: true, raw: true },
31
33
  successSubtle: { var: "--rh-success-subtle", isColor: true, raw: true },
32
34
  infoSubtle: { var: "--rh-info-subtle", isColor: true, raw: true },
35
+ neutralSubtle: { var: "--rh-neutral-subtle", isColor: true, raw: true },
33
36
  text: { var: "--rh-text", isColor: true },
34
37
  textMuted: { var: "--rh-text-muted", isColor: true },
35
38
  surface: { var: "--rh-surface", isColor: true },
@@ -51,6 +54,8 @@ var TOKEN_MAP = {
51
54
  inputPxSm: { var: "--rh-input-px-sm", isColor: false },
52
55
  inputPxMd: { var: "--rh-input-px-md", isColor: false },
53
56
  inputPxLg: { var: "--rh-input-px-lg", isColor: false },
57
+ buttonHeightXxs: { var: "--rh-button-height-xxs", isColor: false },
58
+ buttonHeightXs: { var: "--rh-button-height-xs", isColor: false },
54
59
  buttonHeightSm: { var: "--rh-button-height-sm", isColor: false },
55
60
  buttonHeightMd: { var: "--rh-button-height-md", isColor: false },
56
61
  buttonHeightLg: { var: "--rh-button-height-lg", isColor: false },
@@ -744,7 +749,8 @@ var PRESET_COLORS = /* @__PURE__ */ new Set([
744
749
  "danger",
745
750
  "warning",
746
751
  "success",
747
- "info"
752
+ "info",
753
+ "neutral"
748
754
  ]);
749
755
  var isPresetColor = (c) => PRESET_COLORS.has(c);
750
756
  var variantBaseClasses = {
@@ -754,7 +760,8 @@ var variantBaseClasses = {
754
760
  danger: "rh-bg-danger rh-text-surface rh-border-danger",
755
761
  warning: "rh-bg-warning rh-text-surface rh-border-warning",
756
762
  success: "rh-bg-success rh-text-surface rh-border-success",
757
- info: "rh-bg-info rh-text-surface rh-border-info"
763
+ info: "rh-bg-info rh-text-surface rh-border-info",
764
+ neutral: "rh-bg-neutral rh-text-surface rh-border-neutral"
758
765
  },
759
766
  outline: {
760
767
  primary: "rh-bg-transparent rh-text-primary rh-border-primary",
@@ -762,7 +769,8 @@ var variantBaseClasses = {
762
769
  danger: "rh-bg-transparent rh-text-danger rh-border-danger",
763
770
  warning: "rh-bg-transparent rh-text-warning rh-border-warning",
764
771
  success: "rh-bg-transparent rh-text-success rh-border-success",
765
- info: "rh-bg-transparent rh-text-info rh-border-info"
772
+ info: "rh-bg-transparent rh-text-info rh-border-info",
773
+ neutral: "rh-bg-transparent rh-text-neutral rh-border-neutral"
766
774
  },
767
775
  ghost: {
768
776
  primary: "rh-bg-transparent rh-text-primary rh-border-transparent",
@@ -770,7 +778,8 @@ var variantBaseClasses = {
770
778
  danger: "rh-bg-transparent rh-text-danger rh-border-transparent",
771
779
  warning: "rh-bg-transparent rh-text-warning rh-border-transparent",
772
780
  success: "rh-bg-transparent rh-text-success rh-border-transparent",
773
- info: "rh-bg-transparent rh-text-info rh-border-transparent"
781
+ info: "rh-bg-transparent rh-text-info rh-border-transparent",
782
+ neutral: "rh-bg-transparent rh-text-neutral rh-border-transparent"
774
783
  }
775
784
  };
776
785
  var variantHoverClasses = {
@@ -780,7 +789,8 @@ var variantHoverClasses = {
780
789
  danger: "hover:rh-bg-danger-hover hover:rh-border-danger-hover",
781
790
  warning: "hover:rh-bg-warning-hover hover:rh-border-warning-hover",
782
791
  success: "hover:rh-bg-success-hover hover:rh-border-success-hover",
783
- info: "hover:rh-bg-info-hover hover:rh-border-info-hover"
792
+ info: "hover:rh-bg-info-hover hover:rh-border-info-hover",
793
+ neutral: "hover:rh-bg-neutral-hover hover:rh-border-neutral-hover"
784
794
  },
785
795
  outline: {
786
796
  primary: "hover:rh-bg-primary-subtle",
@@ -788,7 +798,8 @@ var variantHoverClasses = {
788
798
  danger: "hover:rh-bg-danger-subtle",
789
799
  warning: "hover:rh-bg-warning-subtle",
790
800
  success: "hover:rh-bg-success-subtle",
791
- info: "hover:rh-bg-info-subtle"
801
+ info: "hover:rh-bg-info-subtle",
802
+ neutral: "hover:rh-bg-neutral-subtle"
792
803
  },
793
804
  ghost: {
794
805
  primary: "hover:rh-bg-primary-subtle",
@@ -796,7 +807,8 @@ var variantHoverClasses = {
796
807
  danger: "hover:rh-bg-danger-subtle",
797
808
  warning: "hover:rh-bg-warning-subtle",
798
809
  success: "hover:rh-bg-success-subtle",
799
- info: "hover:rh-bg-info-subtle"
810
+ info: "hover:rh-bg-info-subtle",
811
+ neutral: "hover:rh-bg-neutral-subtle"
800
812
  }
801
813
  };
802
814
  function getArbitraryColorStyle(variant, color) {
@@ -805,6 +817,8 @@ function getArbitraryColorStyle(variant, color) {
805
817
  return { color, borderColor: "transparent" };
806
818
  }
807
819
  var sizeClasses = {
820
+ xxs: "rh-text-2xs rh-leading-none rh-px-1.5 rh-h-button-xxs rh-gap-1",
821
+ xs: "rh-text-xs rh-leading-none rh-px-2 rh-h-button-xs rh-gap-1",
808
822
  sm: "rh-text-sm rh-px-3 rh-h-button-sm",
809
823
  md: "rh-text-sm rh-px-4 rh-h-button-md",
810
824
  lg: "rh-text-base rh-px-5 rh-h-button-lg",
@@ -915,7 +929,8 @@ var PRESET_COLORS2 = /* @__PURE__ */ new Set([
915
929
  "danger",
916
930
  "warning",
917
931
  "success",
918
- "info"
932
+ "info",
933
+ "neutral"
919
934
  ]);
920
935
  var isPresetColor2 = (c) => PRESET_COLORS2.has(c);
921
936
  var variantColorClasses = {
@@ -925,7 +940,8 @@ var variantColorClasses = {
925
940
  danger: "rh-bg-danger rh-text-surface rh-border-danger hover:rh-bg-danger-hover hover:rh-border-danger-hover",
926
941
  warning: "rh-bg-warning rh-text-surface rh-border-warning hover:rh-bg-warning-hover hover:rh-border-warning-hover",
927
942
  success: "rh-bg-success rh-text-surface rh-border-success hover:rh-bg-success-hover hover:rh-border-success-hover",
928
- info: "rh-bg-info rh-text-surface rh-border-info hover:rh-bg-info-hover hover:rh-border-info-hover"
943
+ info: "rh-bg-info rh-text-surface rh-border-info hover:rh-bg-info-hover hover:rh-border-info-hover",
944
+ neutral: "rh-bg-neutral rh-text-surface rh-border-neutral hover:rh-bg-neutral-hover hover:rh-border-neutral-hover"
929
945
  },
930
946
  outline: {
931
947
  primary: "rh-bg-transparent rh-text-primary rh-border-primary hover:rh-bg-primary hover:rh-text-surface",
@@ -933,7 +949,8 @@ var variantColorClasses = {
933
949
  danger: "rh-bg-transparent rh-text-danger rh-border-danger hover:rh-bg-danger hover:rh-text-surface",
934
950
  warning: "rh-bg-transparent rh-text-warning rh-border-warning hover:rh-bg-warning hover:rh-text-surface",
935
951
  success: "rh-bg-transparent rh-text-success rh-border-success hover:rh-bg-success hover:rh-text-surface",
936
- info: "rh-bg-transparent rh-text-info rh-border-info hover:rh-bg-info hover:rh-text-surface"
952
+ info: "rh-bg-transparent rh-text-info rh-border-info hover:rh-bg-info hover:rh-text-surface",
953
+ neutral: "rh-bg-transparent rh-text-neutral rh-border-neutral hover:rh-bg-neutral-subtle"
937
954
  },
938
955
  ghost: {
939
956
  primary: "rh-bg-transparent rh-text-primary rh-border-transparent hover:rh-bg-primary-subtle",
@@ -941,7 +958,8 @@ var variantColorClasses = {
941
958
  danger: "rh-bg-transparent rh-text-danger rh-border-transparent hover:rh-bg-danger-subtle",
942
959
  warning: "rh-bg-transparent rh-text-warning rh-border-transparent hover:rh-bg-warning-subtle",
943
960
  success: "rh-bg-transparent rh-text-success rh-border-transparent hover:rh-bg-success-subtle",
944
- info: "rh-bg-transparent rh-text-info rh-border-transparent hover:rh-bg-info-subtle"
961
+ info: "rh-bg-transparent rh-text-info rh-border-transparent hover:rh-bg-info-subtle",
962
+ neutral: "rh-bg-transparent rh-text-neutral rh-border-transparent hover:rh-bg-neutral-subtle"
945
963
  }
946
964
  };
947
965
  function getArbitraryColorStyle2(variant, color) {
@@ -950,6 +968,8 @@ function getArbitraryColorStyle2(variant, color) {
950
968
  return { color, borderColor: "transparent" };
951
969
  }
952
970
  var sizeClasses2 = {
971
+ xxs: "rh-h-4 rh-w-4 rh-text-2xs",
972
+ xs: "rh-h-6 rh-w-6 rh-text-xs",
953
973
  sm: "rh-h-8 rh-w-8 rh-text-sm",
954
974
  md: "rh-h-10 rh-w-10 rh-text-base",
955
975
  lg: "rh-h-12 rh-w-12 rh-text-lg"
@@ -2133,7 +2153,8 @@ var PRESET_COLORS4 = /* @__PURE__ */ new Set([
2133
2153
  "danger",
2134
2154
  "warning",
2135
2155
  "success",
2136
- "info"
2156
+ "info",
2157
+ "neutral"
2137
2158
  ]);
2138
2159
  var isPresetColor4 = (color) => PRESET_COLORS4.has(color);
2139
2160
  var activePresetClasses = {
@@ -2142,7 +2163,8 @@ var activePresetClasses = {
2142
2163
  danger: "rh-bg-danger rh-text-surface rh-border-danger",
2143
2164
  warning: "rh-bg-warning rh-text-surface rh-border-warning",
2144
2165
  success: "rh-bg-success rh-text-surface rh-border-success",
2145
- info: "rh-bg-info rh-text-surface rh-border-info"
2166
+ info: "rh-bg-info rh-text-surface rh-border-info",
2167
+ neutral: "rh-bg-neutral rh-text-surface rh-border-neutral"
2146
2168
  };
2147
2169
  var inactivePresetClasses = {
2148
2170
  primary: "rh-bg-primary/10 rh-text-primary rh-border-primary/30",
@@ -2150,7 +2172,8 @@ var inactivePresetClasses = {
2150
2172
  danger: "rh-bg-danger/10 rh-text-danger rh-border-danger/30",
2151
2173
  warning: "rh-bg-warning/10 rh-text-warning rh-border-warning/30",
2152
2174
  success: "rh-bg-success/10 rh-text-success rh-border-success/30",
2153
- info: "rh-bg-info/10 rh-text-info rh-border-info/30"
2175
+ info: "rh-bg-info/10 rh-text-info rh-border-info/30",
2176
+ neutral: "rh-bg-neutral/10 rh-text-neutral rh-border-neutral/30"
2154
2177
  };
2155
2178
  var hoverActivePresetClasses = {
2156
2179
  primary: "hover:rh-bg-primary-hover hover:rh-border-primary-hover",
@@ -2158,7 +2181,8 @@ var hoverActivePresetClasses = {
2158
2181
  danger: "hover:rh-bg-danger-hover hover:rh-border-danger-hover",
2159
2182
  warning: "hover:rh-bg-warning-hover hover:rh-border-warning-hover",
2160
2183
  success: "hover:rh-bg-success-hover hover:rh-border-success-hover",
2161
- info: "hover:rh-bg-info-hover hover:rh-border-info-hover"
2184
+ info: "hover:rh-bg-info-hover hover:rh-border-info-hover",
2185
+ neutral: "hover:rh-bg-neutral-hover hover:rh-border-neutral-hover"
2162
2186
  };
2163
2187
  var hoverInactivePresetClasses = {
2164
2188
  primary: "hover:rh-bg-primary/20 hover:rh-border-primary/50",
@@ -2166,7 +2190,8 @@ var hoverInactivePresetClasses = {
2166
2190
  danger: "hover:rh-bg-danger/20 hover:rh-border-danger/50",
2167
2191
  warning: "hover:rh-bg-warning/20 hover:rh-border-warning/50",
2168
2192
  success: "hover:rh-bg-success/20 hover:rh-border-success/50",
2169
- info: "hover:rh-bg-info/20 hover:rh-border-info/50"
2193
+ info: "hover:rh-bg-info/20 hover:rh-border-info/50",
2194
+ neutral: "hover:rh-bg-neutral/20 hover:rh-border-neutral/50"
2170
2195
  };
2171
2196
  var sizeClasses8 = {
2172
2197
  sm: "rh-text-xs rh-px-2 rh-py-0.5 rh-gap-1",
@@ -2773,7 +2798,8 @@ var colorClasses = {
2773
2798
  danger: "rh-text-danger",
2774
2799
  warning: "rh-text-warning",
2775
2800
  success: "rh-text-success",
2776
- info: "rh-text-info"
2801
+ info: "rh-text-info",
2802
+ neutral: "rh-text-neutral"
2777
2803
  };
2778
2804
  var Spinner = React9.forwardRef(function Spinner2({ size = "md", color = "primary", label = "Carregando...", className = "", style, ...rest }, ref) {
2779
2805
  const preset = isPresetColor6(color);