@rehagro/ui 1.0.57 → 1.0.59

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.js CHANGED
@@ -469,7 +469,7 @@ var Toast = React9.forwardRef(function Toast2({
469
469
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex-1 rh-min-w-0", children: [
470
470
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "rh-text-sm rh-font-semibold rh-leading-tight", children: title }),
471
471
  description && /* @__PURE__ */ jsxRuntime.jsx(
472
- "p",
472
+ "div",
473
473
  {
474
474
  className: ["rh-mt-1 rh-text-sm rh-leading-normal", descriptionStyles[styleKey]].filter(Boolean).join(" "),
475
475
  children: description
@@ -2756,6 +2756,563 @@ var DateSelect = React9.forwardRef(
2756
2756
  );
2757
2757
  }
2758
2758
  );
2759
+ var HOURS = Array.from({ length: 24 }, (_, i) => i);
2760
+ var MINUTES = Array.from({ length: 60 }, (_, i) => i);
2761
+ var ITEM_HEIGHT = 36;
2762
+ var CLOCK_HOURS_OUTER = [12, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
2763
+ var CLOCK_HOURS_INNER = [0, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23];
2764
+ var CLOCK_MINUTES = Array.from({ length: 12 }, (_, index) => index * 5);
2765
+ var pad = (n) => String(n).padStart(2, "0");
2766
+ var clampClockPart = (value, max) => Math.min(max, Math.max(0, value));
2767
+ var statusClasses4 = {
2768
+ default: "rh-border-border focus-within:rh-border-primary focus-within:rh-ring-2 focus-within:rh-ring-gray-200",
2769
+ error: "rh-border-danger focus-within:rh-border-danger focus-within:rh-ring-2 focus-within:rh-ring-red-100"
2770
+ };
2771
+ var sizeClasses7 = {
2772
+ sm: "rh-min-h-[32px] rh-text-sm rh-px-input-x-sm",
2773
+ md: "rh-min-h-[40px] rh-text-sm rh-px-input-x-md",
2774
+ lg: "rh-min-h-[48px] rh-text-base rh-px-input-x-lg"
2775
+ };
2776
+ var radiusClasses6 = {
2777
+ none: "rh-rounded-none",
2778
+ xxs: "rh-rounded-xxs",
2779
+ xs: "rh-rounded-xs",
2780
+ sm: "rh-rounded-sm",
2781
+ md: "rh-rounded-md",
2782
+ lg: "rh-rounded-lg",
2783
+ xl: "rh-rounded-xl",
2784
+ full: "rh-rounded-full"
2785
+ };
2786
+ var helperStatusClasses4 = {
2787
+ default: "rh-text-text-muted",
2788
+ error: "rh-text-danger"
2789
+ };
2790
+ var getSubtitleClassName4 = (subtitle) => subtitle.trim() === "*" ? "rh-text-danger" : "rh-text-text-muted";
2791
+ var ClockIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
2792
+ "svg",
2793
+ {
2794
+ width: "16",
2795
+ height: "16",
2796
+ viewBox: "0 0 24 24",
2797
+ fill: "none",
2798
+ stroke: "currentColor",
2799
+ strokeWidth: "2",
2800
+ strokeLinecap: "round",
2801
+ strokeLinejoin: "round",
2802
+ "aria-hidden": "true",
2803
+ children: [
2804
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }),
2805
+ /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "12 6 12 12 16 14" })
2806
+ ]
2807
+ }
2808
+ );
2809
+ var EraserIcon2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "15", height: "14", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx(
2810
+ "path",
2811
+ {
2812
+ d: "M15.3134 13.7509H9.45406L16.2384 6.96656C16.4416 6.76343 16.6027 6.52227 16.7127 6.25686C16.8226 5.99145 16.8792 5.70697 16.8792 5.41969C16.8792 5.1324 16.8226 4.84793 16.7127 4.58252C16.6027 4.3171 16.4416 4.07594 16.2384 3.87281L13.0033 0.640783C12.8002 0.437631 12.559 0.276481 12.2936 0.166535C12.0282 0.0565888 11.7437 0 11.4564 0C11.1691 0 10.8846 0.0565888 10.6192 0.166535C10.3538 0.276481 10.1127 0.437631 9.90953 0.640783L0.640783 9.90875C0.437631 10.1119 0.276481 10.353 0.166535 10.6185C0.0565888 10.8839 0 11.1683 0 11.4556C0 11.7429 0.0565888 12.0274 0.166535 12.2928C0.276481 12.5582 0.437631 12.7994 0.640783 13.0025L2.98922 15.3517C3.07635 15.4388 3.17977 15.5078 3.29358 15.5548C3.40739 15.6019 3.52935 15.626 3.6525 15.6259H15.3134C15.5621 15.6259 15.8005 15.5272 15.9763 15.3514C16.1522 15.1755 16.2509 14.9371 16.2509 14.6884C16.2509 14.4398 16.1522 14.2013 15.9763 14.0255C15.8005 13.8497 15.5621 13.7509 15.3134 13.7509Z",
2813
+ fill: "currentColor"
2814
+ }
2815
+ ) });
2816
+ var PencilIcon = () => /* @__PURE__ */ jsxRuntime.jsxs(
2817
+ "svg",
2818
+ {
2819
+ width: "20",
2820
+ height: "20",
2821
+ viewBox: "0 0 24 24",
2822
+ fill: "none",
2823
+ stroke: "currentColor",
2824
+ strokeWidth: "2",
2825
+ strokeLinecap: "round",
2826
+ strokeLinejoin: "round",
2827
+ "aria-hidden": "true",
2828
+ children: [
2829
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 20h4L19 9a2.828 2.828 0 1 0-4-4L4 16v4Z" }),
2830
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m13.5 6.5 4 4" })
2831
+ ]
2832
+ }
2833
+ );
2834
+ function scrollToSelected(ref, index) {
2835
+ const el = ref.current;
2836
+ if (!el) return;
2837
+ const target = index * ITEM_HEIGHT - el.clientHeight / 2 + ITEM_HEIGHT / 2;
2838
+ el.scrollTop = Math.max(0, target);
2839
+ }
2840
+ function getClockPosition(index, radius) {
2841
+ const angle = index / 12 * Math.PI * 2 - Math.PI / 2;
2842
+ return {
2843
+ left: `calc(50% + ${Math.cos(angle) * radius}px)`,
2844
+ top: `calc(50% + ${Math.sin(angle) * radius}px)`
2845
+ };
2846
+ }
2847
+ function getRehagroPortalStyle(source) {
2848
+ const root = source?.closest(".rh-root");
2849
+ if (!root) return void 0;
2850
+ const variables = {};
2851
+ for (let index = 0; index < root.style.length; index += 1) {
2852
+ const property = root.style.item(index);
2853
+ if (!property.startsWith("--rh-")) continue;
2854
+ variables[property] = root.style.getPropertyValue(property);
2855
+ }
2856
+ return variables;
2857
+ }
2858
+ var TimePicker = React9.forwardRef(
2859
+ function TimePicker2(props, ref) {
2860
+ const {
2861
+ label,
2862
+ subtitle,
2863
+ placeholder = "Selecione",
2864
+ status = "default",
2865
+ size = "md",
2866
+ radius = "xs",
2867
+ helperText,
2868
+ disabled = false,
2869
+ className = "",
2870
+ wrapperClassName = "",
2871
+ backgroundColor,
2872
+ presentation = "dropdown"
2873
+ } = props;
2874
+ const triggerId = React9__default.default.useId();
2875
+ const helperId = React9__default.default.useId();
2876
+ const isControlled = props.value !== void 0;
2877
+ const [internalValue, setInternalValue] = React9.useState(
2878
+ props.defaultValue ?? null
2879
+ );
2880
+ const committedValue = isControlled ? props.value ?? null : internalValue;
2881
+ const [isOpen, setIsOpen] = React9.useState(false);
2882
+ const [isHelperDismissed, setIsHelperDismissed] = React9.useState(false);
2883
+ const [dropdownAlign, setDropdownAlign] = React9.useState("left");
2884
+ const [clockStep, setClockStep] = React9.useState("hour");
2885
+ const [isManualClockInput, setIsManualClockInput] = React9.useState(false);
2886
+ const [hasPendingValue, setHasPendingValue] = React9.useState(committedValue != null);
2887
+ const [pendingHour, setPendingHour] = React9.useState(committedValue?.hour ?? 0);
2888
+ const [pendingMinute, setPendingMinute] = React9.useState(committedValue?.minute ?? 0);
2889
+ const wrapperRef = React9.useRef(null);
2890
+ const innerRef = React9.useRef(null);
2891
+ const dropdownRef = React9.useRef(null);
2892
+ const hourColRef = React9.useRef(null);
2893
+ const minuteColRef = React9.useRef(null);
2894
+ React9__default.default.useImperativeHandle(ref, () => innerRef.current);
2895
+ const visualStatus = helperText && isHelperDismissed ? "default" : status;
2896
+ React9.useEffect(() => {
2897
+ if (!isOpen) return;
2898
+ const h = committedValue?.hour ?? 0;
2899
+ const m = committedValue?.minute ?? 0;
2900
+ setPendingHour(h);
2901
+ setPendingMinute(m);
2902
+ setClockStep("hour");
2903
+ setIsManualClockInput(false);
2904
+ setHasPendingValue(committedValue != null);
2905
+ if (presentation === "dropdown") {
2906
+ requestAnimationFrame(() => {
2907
+ scrollToSelected(hourColRef, h);
2908
+ scrollToSelected(minuteColRef, m);
2909
+ });
2910
+ }
2911
+ }, [isOpen]);
2912
+ React9.useEffect(() => {
2913
+ if (!isOpen || presentation !== "dropdown" || !innerRef.current) return;
2914
+ const rect = innerRef.current.getBoundingClientRect();
2915
+ const dropdownW = 240;
2916
+ setDropdownAlign(window.innerWidth - rect.right >= dropdownW ? "left" : "right");
2917
+ }, [isOpen, presentation]);
2918
+ React9.useEffect(() => {
2919
+ if (!isOpen || presentation !== "dropdown") return;
2920
+ const handler = (e) => {
2921
+ if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
2922
+ setIsOpen(false);
2923
+ }
2924
+ };
2925
+ document.addEventListener("mousedown", handler);
2926
+ return () => document.removeEventListener("mousedown", handler);
2927
+ }, [isOpen, presentation]);
2928
+ React9.useEffect(() => {
2929
+ if (!isOpen) return;
2930
+ const handler = (e) => {
2931
+ if (e.key === "Escape") {
2932
+ setIsOpen(false);
2933
+ innerRef.current?.focus();
2934
+ }
2935
+ };
2936
+ document.addEventListener("keydown", handler);
2937
+ return () => document.removeEventListener("keydown", handler);
2938
+ }, [isOpen]);
2939
+ const commit = React9.useCallback(
2940
+ (hour, minute) => {
2941
+ const newValue = { hour, minute };
2942
+ if (helperText) setIsHelperDismissed(true);
2943
+ if (!isControlled) setInternalValue(newValue);
2944
+ props.onChange?.(newValue);
2945
+ setIsOpen(false);
2946
+ },
2947
+ [helperText, isControlled, props]
2948
+ );
2949
+ const handleClear = React9.useCallback(() => {
2950
+ setPendingHour(0);
2951
+ setPendingMinute(0);
2952
+ if (!isControlled) setInternalValue(null);
2953
+ props.onChange?.(void 0);
2954
+ setIsOpen(false);
2955
+ }, [isControlled, props]);
2956
+ const displayText = committedValue != null ? `${pad(committedValue.hour)}:${pad(committedValue.minute)}` : null;
2957
+ const clockDisplayText = hasPendingValue ? `${pad(pendingHour)}:${pad(pendingMinute)}` : "--:--";
2958
+ const closeClockDialog = () => {
2959
+ setIsOpen(false);
2960
+ innerRef.current?.focus();
2961
+ };
2962
+ const handleClockHourChange = (hour) => {
2963
+ setPendingHour(hour);
2964
+ setHasPendingValue(true);
2965
+ setClockStep("minute");
2966
+ };
2967
+ const handleClockMinuteChange = (minute) => {
2968
+ setPendingMinute(minute);
2969
+ setHasPendingValue(true);
2970
+ };
2971
+ const handleManualClockChange = (part, value) => {
2972
+ const numericValue = Number(value.replace(/\D/g, ""));
2973
+ if (Number.isNaN(numericValue)) return;
2974
+ if (part === "hour") {
2975
+ setPendingHour(clampClockPart(numericValue, 23));
2976
+ } else {
2977
+ setPendingMinute(clampClockPart(numericValue, 59));
2978
+ }
2979
+ setHasPendingValue(true);
2980
+ };
2981
+ const clockHourButton = (hour, index, radius2) => {
2982
+ const selected = hasPendingValue && pendingHour === hour;
2983
+ const position = getClockPosition(index, radius2);
2984
+ return /* @__PURE__ */ jsxRuntime.jsx(
2985
+ "button",
2986
+ {
2987
+ type: "button",
2988
+ "aria-label": `${pad(hour)} horas`,
2989
+ onClick: () => handleClockHourChange(hour),
2990
+ className: [
2991
+ "rh-absolute rh-flex rh-h-8 rh-w-8 -rh-translate-x-1/2 -rh-translate-y-1/2 rh-items-center rh-justify-center rh-rounded-full rh-text-sm rh-transition-colors rh-duration-150",
2992
+ selected ? "rh-bg-primary rh-font-semibold rh-text-surface" : "rh-text-text hover:rh-bg-border/40"
2993
+ ].join(" "),
2994
+ style: position,
2995
+ children: pad(hour)
2996
+ },
2997
+ hour
2998
+ );
2999
+ };
3000
+ const clockMinuteButton = (minute, index) => {
3001
+ const selected = hasPendingValue && pendingMinute === minute;
3002
+ const position = getClockPosition(index, 102);
3003
+ return /* @__PURE__ */ jsxRuntime.jsx(
3004
+ "button",
3005
+ {
3006
+ type: "button",
3007
+ "aria-label": `${pad(minute)} minutos`,
3008
+ onClick: () => handleClockMinuteChange(minute),
3009
+ className: [
3010
+ "rh-absolute rh-flex rh-h-8 rh-w-8 -rh-translate-x-1/2 -rh-translate-y-1/2 rh-items-center rh-justify-center rh-rounded-full rh-text-sm rh-transition-colors rh-duration-150",
3011
+ selected ? "rh-bg-primary rh-font-semibold rh-text-surface" : "rh-text-text hover:rh-bg-border/40"
3012
+ ].join(" "),
3013
+ style: position,
3014
+ children: pad(minute)
3015
+ },
3016
+ minute
3017
+ );
3018
+ };
3019
+ return /* @__PURE__ */ jsxRuntime.jsxs(
3020
+ "div",
3021
+ {
3022
+ ref: wrapperRef,
3023
+ className: ["rh-relative rh-flex rh-flex-col rh-gap-1 rh-font-body", wrapperClassName].filter(Boolean).join(" "),
3024
+ children: [
3025
+ label && /* @__PURE__ */ jsxRuntime.jsxs("label", { id: `${triggerId}-label`, className: "rh-flex rh-items-baseline rh-gap-1", children: [
3026
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-text-sm rh-font-medium rh-text-text", children: label }),
3027
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `rh-text-sm ${getSubtitleClassName4(subtitle)}`, children: subtitle })
3028
+ ] }),
3029
+ /* @__PURE__ */ jsxRuntime.jsxs(
3030
+ "button",
3031
+ {
3032
+ ref: innerRef,
3033
+ id: triggerId,
3034
+ type: "button",
3035
+ role: "combobox",
3036
+ "aria-expanded": isOpen,
3037
+ "aria-haspopup": "dialog",
3038
+ "aria-labelledby": label ? `${triggerId}-label` : void 0,
3039
+ "aria-describedby": helperText ? helperId : void 0,
3040
+ "aria-invalid": visualStatus === "error" || void 0,
3041
+ "aria-disabled": disabled || void 0,
3042
+ disabled,
3043
+ onClick: () => !disabled && setIsOpen((o) => !o),
3044
+ style: backgroundColor ? { backgroundColor } : void 0,
3045
+ className: [
3046
+ "rh-group rh-flex rh-items-center rh-justify-between rh-gap-2",
3047
+ "rh-border rh-font-body",
3048
+ !backgroundColor && "rh-bg-surface",
3049
+ "rh-transition-colors rh-duration-150",
3050
+ "rh-text-left rh-w-full",
3051
+ statusClasses4[visualStatus],
3052
+ radiusClasses6[radius],
3053
+ sizeClasses7[size],
3054
+ disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-bg-background" : "rh-cursor-pointer",
3055
+ className
3056
+ ].filter(Boolean).join(" "),
3057
+ children: [
3058
+ /* @__PURE__ */ jsxRuntime.jsx(
3059
+ "span",
3060
+ {
3061
+ className: [
3062
+ "rh-flex-1 rh-truncate",
3063
+ displayText ? "rh-text-text" : "rh-text-text-muted group-hover:rh-text-text"
3064
+ ].join(" "),
3065
+ children: displayText ?? placeholder
3066
+ }
3067
+ ),
3068
+ /* @__PURE__ */ jsxRuntime.jsx(ClockIcon, {})
3069
+ ]
3070
+ }
3071
+ ),
3072
+ isOpen && presentation === "dropdown" && /* @__PURE__ */ jsxRuntime.jsxs(
3073
+ "div",
3074
+ {
3075
+ ref: dropdownRef,
3076
+ role: "dialog",
3077
+ "aria-label": "Seletor de hora",
3078
+ className: [
3079
+ "rh-absolute rh-z-50 rh-mt-1",
3080
+ "rh-bg-surface rh-rounded-xs rh-border rh-border-border",
3081
+ "rh-w-[240px]",
3082
+ dropdownAlign === "left" ? "rh-left-0" : "rh-right-0"
3083
+ ].filter(Boolean).join(" "),
3084
+ style: {
3085
+ top: "100%",
3086
+ boxShadow: "0 0 9.6px 0 rgba(8, 11, 18, 0.08)"
3087
+ },
3088
+ children: [
3089
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex rh-border-b rh-border-border", children: [
3090
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-flex-1 rh-py-2 rh-text-center rh-text-xs rh-font-semibold rh-text-text-muted rh-uppercase rh-tracking-wide", children: "Hora" }),
3091
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-w-px rh-bg-border" }),
3092
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-flex-1 rh-py-2 rh-text-center rh-text-xs rh-font-semibold rh-text-text-muted rh-uppercase rh-tracking-wide", children: "Minuto" })
3093
+ ] }),
3094
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex", style: { height: 216 }, children: [
3095
+ /* @__PURE__ */ jsxRuntime.jsx(
3096
+ "div",
3097
+ {
3098
+ ref: hourColRef,
3099
+ className: "rh-flex-1 rh-overflow-y-auto rh-py-1 rh-scrollbar-thin",
3100
+ style: { scrollbarWidth: "none" },
3101
+ children: HOURS.map((h) => {
3102
+ const selected = h === pendingHour;
3103
+ return /* @__PURE__ */ jsxRuntime.jsx(
3104
+ "button",
3105
+ {
3106
+ type: "button",
3107
+ onClick: () => setPendingHour(h),
3108
+ style: { height: ITEM_HEIGHT },
3109
+ className: [
3110
+ "rh-w-full rh-flex rh-items-center rh-justify-center rh-text-sm rh-transition-colors rh-duration-100",
3111
+ selected ? "rh-bg-primary rh-text-surface rh-font-semibold" : "rh-text-text hover:rh-bg-background"
3112
+ ].join(" "),
3113
+ children: pad(h)
3114
+ },
3115
+ h
3116
+ );
3117
+ })
3118
+ }
3119
+ ),
3120
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-w-px rh-bg-border rh-self-stretch" }),
3121
+ /* @__PURE__ */ jsxRuntime.jsx(
3122
+ "div",
3123
+ {
3124
+ ref: minuteColRef,
3125
+ className: "rh-flex-1 rh-overflow-y-auto rh-py-1",
3126
+ style: { scrollbarWidth: "none" },
3127
+ children: MINUTES.map((m) => {
3128
+ const selected = m === pendingMinute;
3129
+ return /* @__PURE__ */ jsxRuntime.jsx(
3130
+ "button",
3131
+ {
3132
+ type: "button",
3133
+ onClick: () => setPendingMinute(m),
3134
+ style: { height: ITEM_HEIGHT },
3135
+ className: [
3136
+ "rh-w-full rh-flex rh-items-center rh-justify-center rh-text-sm rh-transition-colors rh-duration-100",
3137
+ selected ? "rh-bg-primary rh-text-surface rh-font-semibold" : "rh-text-text hover:rh-bg-background"
3138
+ ].join(" "),
3139
+ children: pad(m)
3140
+ },
3141
+ m
3142
+ );
3143
+ })
3144
+ }
3145
+ )
3146
+ ] }),
3147
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex rh-items-center rh-justify-between rh-px-3 rh-py-2 rh-border-t rh-border-border", children: [
3148
+ /* @__PURE__ */ jsxRuntime.jsxs(
3149
+ "button",
3150
+ {
3151
+ type: "button",
3152
+ onClick: handleClear,
3153
+ className: "rh-flex rh-items-center rh-gap-1.5 rh-text-sm rh-text-text rh-font-medium rh-px-2 rh-py-1.5 rh-rounded-sm hover:rh-bg-background rh-transition-colors rh-duration-150",
3154
+ children: [
3155
+ /* @__PURE__ */ jsxRuntime.jsx(EraserIcon2, {}),
3156
+ "Limpar"
3157
+ ]
3158
+ }
3159
+ ),
3160
+ /* @__PURE__ */ jsxRuntime.jsx(
3161
+ "button",
3162
+ {
3163
+ type: "button",
3164
+ onClick: () => commit(pendingHour, pendingMinute),
3165
+ className: "rh-text-sm rh-font-medium rh-px-4 rh-py-1.5 rh-rounded-lg rh-bg-primary rh-text-surface hover:rh-opacity-90 rh-transition-opacity rh-duration-150",
3166
+ children: "Aplicar"
3167
+ }
3168
+ )
3169
+ ] })
3170
+ ]
3171
+ }
3172
+ ),
3173
+ isOpen && presentation === "clock" && typeof document !== "undefined" && reactDom.createPortal(
3174
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-root", style: getRehagroPortalStyle(wrapperRef.current), children: /* @__PURE__ */ jsxRuntime.jsx(
3175
+ "div",
3176
+ {
3177
+ role: "presentation",
3178
+ className: "rh-fixed rh-inset-0 rh-z-50 rh-flex rh-items-center rh-justify-center rh-bg-text/50 rh-p-4",
3179
+ onMouseDown: (event) => {
3180
+ if (event.target === event.currentTarget) closeClockDialog();
3181
+ },
3182
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
3183
+ "div",
3184
+ {
3185
+ ref: dropdownRef,
3186
+ role: "dialog",
3187
+ "aria-modal": "true",
3188
+ "aria-label": "Seletor de hora",
3189
+ className: "rh-flex rh-w-full rh-max-w-[360px] rh-flex-col rh-rounded-sm rh-bg-surface rh-p-6 rh-text-text",
3190
+ style: { boxShadow: "0 24px 48px rgb(8 11 18 / 0.24)" },
3191
+ children: [
3192
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-text-sm rh-font-normal rh-uppercase rh-text-text-muted", children: "Selecione a hora" }),
3193
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-mt-6 rh-flex rh-items-center rh-justify-between", children: [
3194
+ isManualClockInput ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex rh-items-center rh-gap-2", children: [
3195
+ /* @__PURE__ */ jsxRuntime.jsx(
3196
+ "input",
3197
+ {
3198
+ "aria-label": "Hora",
3199
+ inputMode: "numeric",
3200
+ maxLength: 2,
3201
+ value: pad(pendingHour),
3202
+ onChange: (event) => handleManualClockChange("hour", event.target.value),
3203
+ className: "rh-h-12 rh-w-14 rh-rounded-xs rh-border rh-border-border rh-bg-surface rh-text-center rh-text-2xl rh-font-semibold rh-text-text rh-outline-none focus:rh-border-primary focus:rh-ring-2 focus:rh-ring-gray-200"
3204
+ }
3205
+ ),
3206
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-text-2xl rh-font-semibold rh-text-text-muted", children: ":" }),
3207
+ /* @__PURE__ */ jsxRuntime.jsx(
3208
+ "input",
3209
+ {
3210
+ "aria-label": "Minuto",
3211
+ inputMode: "numeric",
3212
+ maxLength: 2,
3213
+ value: pad(pendingMinute),
3214
+ onChange: (event) => handleManualClockChange("minute", event.target.value),
3215
+ className: "rh-h-12 rh-w-14 rh-rounded-xs rh-border rh-border-border rh-bg-surface rh-text-center rh-text-2xl rh-font-semibold rh-text-text rh-outline-none focus:rh-border-primary focus:rh-ring-2 focus:rh-ring-gray-200"
3216
+ }
3217
+ )
3218
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-flex rh-items-center rh-gap-1 rh-text-2xl rh-font-semibold", children: [
3219
+ /* @__PURE__ */ jsxRuntime.jsx(
3220
+ "button",
3221
+ {
3222
+ type: "button",
3223
+ onClick: () => setClockStep("hour"),
3224
+ className: [
3225
+ "rh-rounded-xs rh-px-1 rh-transition-colors rh-duration-150",
3226
+ clockStep === "hour" ? "rh-text-text" : "rh-text-text-muted hover:rh-bg-background"
3227
+ ].join(" "),
3228
+ children: clockDisplayText.slice(0, 2)
3229
+ }
3230
+ ),
3231
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-text-text-muted", children: ":" }),
3232
+ /* @__PURE__ */ jsxRuntime.jsx(
3233
+ "button",
3234
+ {
3235
+ type: "button",
3236
+ onClick: () => setClockStep("minute"),
3237
+ className: [
3238
+ "rh-rounded-xs rh-px-1 rh-transition-colors rh-duration-150",
3239
+ clockStep === "minute" ? "rh-text-text" : "rh-text-text-muted hover:rh-bg-background"
3240
+ ].join(" "),
3241
+ children: clockDisplayText.slice(3, 5)
3242
+ }
3243
+ )
3244
+ ] }),
3245
+ /* @__PURE__ */ jsxRuntime.jsx(
3246
+ "button",
3247
+ {
3248
+ type: "button",
3249
+ "aria-label": isManualClockInput ? "Voltar ao rel\xF3gio" : "Digitar hor\xE1rio manualmente",
3250
+ onClick: () => setIsManualClockInput((current) => !current),
3251
+ className: "rh-rounded-full rh-p-2 rh-text-text hover:rh-bg-background",
3252
+ children: /* @__PURE__ */ jsxRuntime.jsx(PencilIcon, {})
3253
+ }
3254
+ )
3255
+ ] }),
3256
+ !isManualClockInput && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rh-mx-auto rh-mt-8 rh-flex rh-h-[256px] rh-w-[256px] rh-items-center rh-justify-center rh-rounded-full rh-bg-background", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-relative rh-h-full rh-w-full", children: [
3257
+ clockStep === "hour" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3258
+ CLOCK_HOURS_OUTER.map(
3259
+ (hour, index) => clockHourButton(hour, index, 102)
3260
+ ),
3261
+ CLOCK_HOURS_INNER.map(
3262
+ (hour, index) => clockHourButton(hour, index, 68)
3263
+ )
3264
+ ] }) : CLOCK_MINUTES.map((minute, index) => clockMinuteButton(minute, index)),
3265
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-absolute rh-left-1/2 rh-top-1/2 rh-h-2 rh-w-2 -rh-translate-x-1/2 -rh-translate-y-1/2 rh-rounded-full rh-bg-primary" })
3266
+ ] }) }),
3267
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rh-mt-8 rh-flex rh-justify-end rh-gap-6", children: [
3268
+ /* @__PURE__ */ jsxRuntime.jsx(
3269
+ "button",
3270
+ {
3271
+ type: "button",
3272
+ onClick: closeClockDialog,
3273
+ className: "rh-text-base rh-font-medium rh-uppercase rh-text-primary hover:rh-opacity-80",
3274
+ children: "Cancelar"
3275
+ }
3276
+ ),
3277
+ /* @__PURE__ */ jsxRuntime.jsx(
3278
+ "button",
3279
+ {
3280
+ type: "button",
3281
+ onClick: () => {
3282
+ if (hasPendingValue) commit(pendingHour, pendingMinute);
3283
+ else closeClockDialog();
3284
+ },
3285
+ className: "rh-text-base rh-font-medium rh-uppercase rh-text-primary hover:rh-opacity-80",
3286
+ children: "OK"
3287
+ }
3288
+ )
3289
+ ] })
3290
+ ]
3291
+ }
3292
+ )
3293
+ }
3294
+ ) }),
3295
+ document.body
3296
+ ),
3297
+ helperText && !isHelperDismissed && /* @__PURE__ */ jsxRuntime.jsxs(
3298
+ "span",
3299
+ {
3300
+ id: helperId,
3301
+ className: [
3302
+ "rh-flex rh-items-center rh-gap-1 rh-text-xs",
3303
+ helperStatusClasses4[visualStatus]
3304
+ ].join(" "),
3305
+ children: [
3306
+ /* @__PURE__ */ jsxRuntime.jsx(WarningCircleIcon, {}),
3307
+ helperText
3308
+ ]
3309
+ }
3310
+ )
3311
+ ]
3312
+ }
3313
+ );
3314
+ }
3315
+ );
2759
3316
  var variantClasses = {
2760
3317
  light: "rh-bg-surface rh-text-text rh-border rh-border-border rh-shadow-md",
2761
3318
  default: "rh-bg-primary/10 rh-text-text rh-border rh-border-primary/20 rh-shadow-md",
@@ -2766,7 +3323,7 @@ var arrowVariantClasses = {
2766
3323
  default: "rh-border-primary/20 rh-bg-primary/10",
2767
3324
  dark: "rh-bg-primary"
2768
3325
  };
2769
- var sizeClasses7 = {
3326
+ var sizeClasses8 = {
2770
3327
  sm: "rh-px-3 rh-py-1.5 rh-text-xs",
2771
3328
  md: "rh-px-4 rh-py-3 rh-text-sm"
2772
3329
  };
@@ -2897,7 +3454,7 @@ var Tooltip = React9.forwardRef(
2897
3454
  "rh-absolute rh-z-50 rh-w-max rh-max-w-xs rh-rounded-xs",
2898
3455
  tooltipPlacementClasses[placement],
2899
3456
  variantClasses[variant],
2900
- sizeClasses7[size],
3457
+ sizeClasses8[size],
2901
3458
  className
2902
3459
  ].filter(Boolean).join(" "),
2903
3460
  children: [
@@ -2998,7 +3555,7 @@ function getAvatarColors(name) {
2998
3555
  const index = hash % AVATAR_COLORS.length;
2999
3556
  return AVATAR_COLORS[index];
3000
3557
  }
3001
- var sizeClasses8 = {
3558
+ var sizeClasses9 = {
3002
3559
  sm: "rh-w-8 rh-h-8 rh-text-xs",
3003
3560
  md: "rh-w-10 rh-h-10 rh-text-sm",
3004
3561
  lg: "rh-w-12 rh-h-12 rh-text-base",
@@ -3033,7 +3590,7 @@ var Avatar = React9.forwardRef(function Avatar2({ src, alt = "", initials, size
3033
3590
  "rh-inline-flex rh-items-center rh-justify-center rh-shrink-0 rh-overflow-hidden",
3034
3591
  avatarColors ? "" : "rh-bg-primary rh-text-surface",
3035
3592
  "rh-font-display rh-font-medium rh-select-none",
3036
- sizeClasses8[size],
3593
+ sizeClasses9[size],
3037
3594
  variantClasses2[variant],
3038
3595
  className
3039
3596
  ].filter(Boolean).join(" "),
@@ -3100,7 +3657,7 @@ var hoverInactivePresetClasses = {
3100
3657
  info: "hover:rh-bg-info/20 hover:rh-border-info/50",
3101
3658
  neutral: "hover:rh-bg-neutral/20 hover:rh-border-neutral/50"
3102
3659
  };
3103
- var sizeClasses9 = {
3660
+ var sizeClasses10 = {
3104
3661
  sm: "rh-text-xs rh-px-2 rh-py-0.5 rh-gap-1",
3105
3662
  md: "rh-text-sm rh-px-2.5 rh-py-1 rh-gap-1.5",
3106
3663
  lg: "rh-text-sm rh-px-3 rh-py-1.5 rh-gap-1.5"
@@ -3147,7 +3704,7 @@ var Tag = React9.forwardRef(function Tag2({
3147
3704
  "rh-transition-colors rh-duration-150",
3148
3705
  "rh-cursor-pointer",
3149
3706
  clickable ? "rh-cursor-pointer" : "",
3150
- sizeClasses9[size],
3707
+ sizeClasses10[size],
3151
3708
  colorClasses3,
3152
3709
  hoverClasses,
3153
3710
  disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-pointer-events-none" : "",
@@ -3164,16 +3721,16 @@ var Tag = React9.forwardRef(function Tag2({
3164
3721
  }
3165
3722
  );
3166
3723
  });
3167
- var statusClasses4 = {
3724
+ var statusClasses5 = {
3168
3725
  default: "rh-border-border focus-within:rh-ring-2 focus-within:rh-ring-ring focus-within:rh-ring-offset-2",
3169
3726
  error: "rh-border-danger focus-within:rh-ring-2 focus-within:rh-ring-danger focus-within:rh-ring-offset-2"
3170
3727
  };
3171
- var sizeClasses10 = {
3728
+ var sizeClasses11 = {
3172
3729
  sm: "rh-min-h-[36px] rh-text-sm rh-px-2 rh-py-1",
3173
3730
  md: "rh-h-[44px] rh-text-sm rh-px-2 rh-py-[6px]",
3174
3731
  lg: "rh-min-h-[52px] rh-text-base rh-px-3 rh-py-2"
3175
3732
  };
3176
- var radiusClasses6 = {
3733
+ var radiusClasses7 = {
3177
3734
  none: "rh-rounded-none",
3178
3735
  xxs: "rh-rounded-xxs",
3179
3736
  xs: "rh-rounded-xs",
@@ -3183,7 +3740,7 @@ var radiusClasses6 = {
3183
3740
  xl: "rh-rounded-xl",
3184
3741
  full: "rh-rounded-full"
3185
3742
  };
3186
- var helperStatusClasses4 = {
3743
+ var helperStatusClasses5 = {
3187
3744
  default: "rh-text-text-muted",
3188
3745
  error: "rh-text-danger"
3189
3746
  };
@@ -3202,7 +3759,7 @@ var addButtonSizeClasses = {
3202
3759
  md: "rh-w-5 rh-h-5",
3203
3760
  lg: "rh-w-5 rh-h-5"
3204
3761
  };
3205
- var getSubtitleClassName4 = (subtitle) => subtitle.trim() === "*" ? "rh-text-danger" : "rh-text-text-muted";
3762
+ var getSubtitleClassName5 = (subtitle) => subtitle.trim() === "*" ? "rh-text-danger" : "rh-text-text-muted";
3206
3763
  var TagInput = React9.forwardRef(function TagInput2({
3207
3764
  label,
3208
3765
  subtitle,
@@ -3259,7 +3816,7 @@ var TagInput = React9.forwardRef(function TagInput2({
3259
3816
  children: [
3260
3817
  label && /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: inputId, className: "rh-flex rh-items-baseline rh-gap-1", children: [
3261
3818
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rh-text-sm rh-font-semibold rh-text-text", children: label }),
3262
- subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `rh-text-sm ${getSubtitleClassName4(subtitle)}`, children: subtitle })
3819
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `rh-text-sm ${getSubtitleClassName5(subtitle)}`, children: subtitle })
3263
3820
  ] }),
3264
3821
  /* @__PURE__ */ jsxRuntime.jsxs(
3265
3822
  "div",
@@ -3269,9 +3826,9 @@ var TagInput = React9.forwardRef(function TagInput2({
3269
3826
  "rh-flex rh-flex-row rh-items-center rh-justify-between rh-gap-2",
3270
3827
  "rh-border rh-bg-surface rh-font-body",
3271
3828
  "rh-transition-colors rh-duration-150",
3272
- statusClasses4[status],
3273
- radiusClasses6[radius],
3274
- sizeClasses10[size],
3829
+ statusClasses5[status],
3830
+ radiusClasses7[radius],
3831
+ sizeClasses11[size],
3275
3832
  disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-bg-background" : "rh-cursor-pointer",
3276
3833
  className
3277
3834
  ].filter(Boolean).join(" "),
@@ -3434,7 +3991,7 @@ var TagInput = React9.forwardRef(function TagInput2({
3434
3991
  id: `${inputId}-helper`,
3435
3992
  className: [
3436
3993
  "rh-flex rh-items-center rh-gap-1 rh-text-xs",
3437
- helperStatusClasses4[status]
3994
+ helperStatusClasses5[status]
3438
3995
  ].join(" "),
3439
3996
  children: helperText
3440
3997
  }
@@ -3541,12 +4098,12 @@ var PRESET_COLORS5 = /* @__PURE__ */ new Set([
3541
4098
  "info"
3542
4099
  ]);
3543
4100
  var isPresetColor5 = (color) => PRESET_COLORS5.has(color);
3544
- var sizeClasses11 = {
4101
+ var sizeClasses12 = {
3545
4102
  sm: { container: "rh-h-8", button: "rh-px-2 rh-text-xs" },
3546
4103
  md: { container: "rh-h-9", button: "rh-px-3 rh-text-sm" },
3547
4104
  lg: { container: "rh-h-10", button: "rh-px-4 rh-text-sm" }
3548
4105
  };
3549
- var radiusClasses7 = {
4106
+ var radiusClasses8 = {
3550
4107
  none: "rh-rounded-none",
3551
4108
  xs: "rh-rounded-xs",
3552
4109
  sm: "rh-rounded-sm",
@@ -3579,8 +4136,8 @@ function ToggleGroupInner({
3579
4136
  className: [
3580
4137
  "rh-inline-flex rh-items-center rh-bg-muted rh-overflow-hidden",
3581
4138
  "rh-p-1 rh-gap-0.5",
3582
- radiusClasses7[radius],
3583
- sizeClasses11[size].container,
4139
+ radiusClasses8[radius],
4140
+ sizeClasses12[size].container,
3584
4141
  disabled ? "rh-opacity-50 rh-cursor-not-allowed" : "",
3585
4142
  className
3586
4143
  ].filter(Boolean).join(" "),
@@ -3602,8 +4159,8 @@ function ToggleGroupInner({
3602
4159
  "rh-border-0 rh-font-display rh-font-medium",
3603
4160
  "rh-transition-all rh-duration-150",
3604
4161
  "focus-visible:rh-outline-none focus-visible:rh-ring-2 focus-visible:rh-ring-ring",
3605
- radiusClasses7[radius],
3606
- sizeClasses11[size].button,
4162
+ radiusClasses8[radius],
4163
+ sizeClasses12[size].button,
3607
4164
  isActive ? "rh-bg-surface rh-text-text rh-shadow-sm" : "rh-bg-transparent rh-text-text-muted",
3608
4165
  !isActive && !isDisabled ? "hover:rh-bg-surface/50" : "",
3609
4166
  isDisabled ? "rh-cursor-not-allowed rh-pointer-events-none" : "rh-cursor-pointer"
@@ -3626,7 +4183,7 @@ var variantClasses3 = {
3626
4183
  outlined: "rh-bg-surface rh-border rh-border-border rh-shadow-none",
3627
4184
  filled: "rh-bg-background rh-border-0 rh-shadow-none"
3628
4185
  };
3629
- var radiusClasses8 = {
4186
+ var radiusClasses9 = {
3630
4187
  none: "rh-rounded-none",
3631
4188
  xs: "rh-rounded-xs",
3632
4189
  sm: "rh-rounded-sm",
@@ -3661,7 +4218,7 @@ var CardRoot = React9.forwardRef(function Card({
3661
4218
  className: [
3662
4219
  "rh-font-body rh-transition-all rh-duration-150",
3663
4220
  variantClasses3[variant],
3664
- radiusClasses8[radius],
4221
+ radiusClasses9[radius],
3665
4222
  paddingClasses[padding],
3666
4223
  isInteractive ? "rh-cursor-pointer hover:rh-shadow-lg hover:rh-scale-[1.01] active:rh-scale-[0.99]" : "",
3667
4224
  disabled ? "rh-opacity-50 rh-cursor-not-allowed rh-pointer-events-none" : "",
@@ -3714,7 +4271,7 @@ var PRESET_COLORS6 = /* @__PURE__ */ new Set([
3714
4271
  "info"
3715
4272
  ]);
3716
4273
  var isPresetColor6 = (color) => PRESET_COLORS6.has(color);
3717
- var sizeClasses12 = {
4274
+ var sizeClasses13 = {
3718
4275
  xs: "rh-w-3 rh-h-3",
3719
4276
  sm: "rh-w-4 rh-h-4",
3720
4277
  md: "rh-w-6 rh-h-6",
@@ -3742,7 +4299,7 @@ var Spinner = React9.forwardRef(function Spinner2({ size = "md", color = "primar
3742
4299
  "aria-label": label,
3743
4300
  className: [
3744
4301
  "rh-inline-flex rh-items-center rh-justify-center",
3745
- sizeClasses12[size],
4302
+ sizeClasses13[size],
3746
4303
  colorClass,
3747
4304
  className
3748
4305
  ].filter(Boolean).join(" "),
@@ -4195,7 +4752,7 @@ var CustomSelect = ({
4195
4752
  )
4196
4753
  ] });
4197
4754
  };
4198
- var sizeClasses13 = {
4755
+ var sizeClasses14 = {
4199
4756
  sm: { cell: "rh-px-2 rh-py-2 rh-text-xs", header: "rh-px-2 rh-py-2 rh-text-xs" },
4200
4757
  md: { cell: "rh-px-3 rh-py-3 rh-text-sm", header: "rh-px-3 rh-py-3 rh-text-xs" },
4201
4758
  lg: { cell: "rh-px-4 rh-py-4 rh-text-sm", header: "rh-px-4 rh-py-3 rh-text-sm" }
@@ -4350,7 +4907,7 @@ function TableInner({
4350
4907
  ...rowPaddingStyle
4351
4908
  },
4352
4909
  className: [
4353
- rowPadding ? "" : sizeClasses13[size].header,
4910
+ rowPadding ? "" : sizeClasses14[size].header,
4354
4911
  alignClasses[column.align || "left"],
4355
4912
  `rh-font-semibold rh-whitespace-nowrap ${headerTextClassName || "rh-text-text-muted"}`,
4356
4913
  stickyHeader ? "rh-sticky rh-top-0 rh-bg-surface rh-z-10" : "",
@@ -4431,7 +4988,7 @@ function TableInner({
4431
4988
  {
4432
4989
  style: { width: column.width, maxWidth: column.maxWidth, ...rowPaddingStyle },
4433
4990
  className: [
4434
- rowPadding ? "" : sizeClasses13[size].cell,
4991
+ rowPadding ? "" : sizeClasses14[size].cell,
4435
4992
  alignClasses[column.align || "left"],
4436
4993
  "rh-text-text"
4437
4994
  ].filter(Boolean).join(" "),
@@ -4960,6 +5517,7 @@ exports.Table = Table;
4960
5517
  exports.Tag = Tag;
4961
5518
  exports.TagInput = TagInput;
4962
5519
  exports.TextInput = TextInput;
5520
+ exports.TimePicker = TimePicker;
4963
5521
  exports.Toast = Toast;
4964
5522
  exports.ToastContainer = ToastContainer;
4965
5523
  exports.ToastProvider = ToastProvider;