@g4rcez/components 0.0.47 → 0.0.49

package/dist/src/components/core/render-on-view.d.ts

@@ -0,0 +1,7 @@
+import React, { PropsWithChildren } from "react";
+import { PolymorphicProps } from "./polymorph";
+export type RenderOnViewProps<T extends React.ElementType = "div"> = PolymorphicProps<{
+    onIntersection?: () => void;
+}, T>;
+export declare const RenderOnView: ({ children, ...props }: PropsWithChildren<RenderOnViewProps>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=render-on-view.d.ts.map

package/dist/src/components/core/render-on-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"render-on-view.d.ts","sourceRoot":"","sources":["../../../../src/components/core/render-on-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAEpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAAC;IAAE,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,EAAE,CAAC,CAAC,CAAC;AAY1H,eAAO,MAAM,YAAY,2BAA4B,iBAAiB,CAAC,iBAAiB,CAAC,4CAsBxF,CAAC"}

package/dist/src/components/core/render-on-view.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState } from "react";
+import { useStableRef } from "../../hooks/use-stable-ref";
+function isInViewport(el) {
+    const rect = el.getBoundingClientRect();
+    return (rect.top >= 0 &&
+        rect.left >= 0 &&
+        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
+        rect.right <= (window.innerWidth || document.documentElement.clientWidth) /* or $(window).width() */);
+}
+export const RenderOnView = ({ children, ...props }) => {
+    const onIntersect = useStableRef(props.onIntersection);
+    const ref = useRef(null);
+    const [shouldRender, setShouldRender] = useState(() => (ref.current === null ? false : isInViewport(ref.current)));
+    useLayoutEffect(() => {
+        const div = ref.current;
+        if (div === null)
+            return;
+        const observer = new IntersectionObserver((args) => {
+            const first = args[0];
+            if (first.isIntersecting)
+                onIntersect.current?.();
+            return setShouldRender((prev) => (first.isIntersecting ? true : prev));
+        });
+        observer.observe(div);
+        return () => observer.disconnect();
+    }, []);
+    return (_jsx("div", { ...props, ref: ref, children: shouldRender ? children : null }));
+};

package/dist/src/components/display/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,eAAe,EAAU,MAAM,eAAe,CAAC;AAExD,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,UAAW,iBAAiB,CAAC,aAAa,CAAC,4CAgB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;mFAajB,CAAC;AAEH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,YAAY,CAAC,OAAO,aAAa,CAAC,GAC9B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GAwCxE,CAAC"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,eAAe,EAAU,MAAM,eAAe,CAAC;AAExD,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,UAAW,iBAAiB,CAAC,aAAa,CAAC,4CAgB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;mFAajB,CAAC;AAEH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,YAAY,CAAC,OAAO,aAAa,CAAC,GAC9B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GAyCxE,CAAC"}

package/dist/src/components/display/alert.js

@@ -14,7 +14,7 @@ const transition = {
     duration: 0.7,
     ease: [0.04, 0.62, 0.23, 0.98],
 };
-export const Collapse = (props) => (_jsx(motion.div, { ...props, layout: true, layoutRoot: true, layoutScroll: true, initial: false, animate: props.open.toString(), "aria-hidden": !props.open, className: props.className, exit: variants.false, transition: transition, variants: variants, children: props.children }));
+export const Collapse = (props) => (_jsx(motion.div, { ...props, layout: true, layoutRoot: true, layoutScroll: true, initial: false, variants: variants, exit: variants.false, transition: transition, "aria-hidden": !props.open, animate: props.open.toString(), className: css("aria-hidden:pointer-events-none", props.className), children: props.children }));
 const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm", {
     variants: {
         theme: {
@@ -30,5 +30,6 @@ const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm",
     defaultVariants: { theme: "neutral" },
 });
 export const Alert = forwardRef(function Alert({ className, theme, Icon, onClose, open = true, ...props }, ref) {
-    return (_jsx("div", { "data-open": !!open, "aria-hidden": !open, className: "pointer-events-none w-full isolate data-[open=true]:pointer-events-auto data-[open=true]:mb-4", children: _jsx(Collapse, { "data-open": !!open, open: !!open, children: _jsxs(Polymorph, { ...props, className: css(alertVariants({ theme }), className), ref: ref, "data-theme": theme, role: "alert", as: props.as ?? "div", children: [_jsxs("h4", { className: "mb-2 flex items-center gap-2", children: [!Icon && theme === "success" ? _jsx(CheckCircleIcon, { size: 20 }) : null, !Icon && theme === "info" ? _jsx(InfoIcon, { size: 20 }) : null, !Icon && theme === "danger" ? _jsx(TriangleAlertIcon, { size: 20 }) : null, Icon, _jsx("span", { className: "tracking-3 text-balance text-lg font-semibold", children: props.title })] }), props.children, onClose !== undefined ? (_jsx("button", { type: "button", onClick: () => onClose(false), className: "absolute right-3 top-3 text-foreground transition-colors duration-300 ease-in-out hover:text-danger", children: _jsx(XIcon, { size: 20 }) })) : null] }) }) }));
+    const close = () => onClose?.(false);
+    return (_jsx("div", { "data-open": !!open, "aria-hidden": !open, className: "pointer-events-none w-full isolate aria-hidden:pointer-events-auto", children: _jsx(Collapse, { "data-open": !!open, open: !!open, children: _jsxs(Polymorph, { ...props, className: css(alertVariants({ theme }), className), ref: ref, "data-theme": theme, role: "alert", as: props.as ?? "div", children: [_jsxs("h4", { className: "mb-2 flex items-center gap-2", children: [!Icon && theme === "success" ? _jsx(CheckCircleIcon, { size: 20 }) : null, !Icon && theme === "info" ? _jsx(InfoIcon, { size: 20 }) : null, !Icon && theme === "danger" ? _jsx(TriangleAlertIcon, { size: 20 }) : null, Icon, _jsx("span", { className: "tracking-3 text-balance text-lg font-semibold", children: props.title })] }), props.children, onClose !== undefined ? (_jsx("button", { type: "button", onClick: close, className: "absolute right-3 top-3 text-foreground transition-colors duration-300 ease-in-out hover:text-danger", children: _jsx(XIcon, { size: 20 }) })) : null] }) }) }));
 });

package/dist/src/components/display/calendar.d.ts

@@ -7,7 +7,12 @@ type Range = {
 type OnChangeDate = (d: Date | undefined) => void;
 type OnChangeRange = (d: Range | undefined) => void;
 export type CalendarProps<T extends "date" | "range" | undefined = undefined> = Partial<{
+    labelRange: {
+        to: string;
+        from: string;
+    };
     locale: Locales;
+    markRange: boolean;
     markToday: boolean;
     rangeMode: boolean;
     changeOnlyOnClick: boolean;
@@ -37,6 +42,6 @@ export type CalendarProps<T extends "date" | "range" | undefined = undefined> =
     range: Range;
     onChange: OnChangeRange;
 })>;
-export declare const Calendar: ({ RenderOnDay, changeOnlyOnClick, disabledDate, locale, markToday, onChangeMonth, onChangeYear, rangeMode, onChange, styles, ...props }: CalendarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Calendar: ({ RenderOnDay, changeOnlyOnClick, labelRange, disabledDate, locale, markToday, onChangeMonth, onChangeYear, rangeMode, onChange, styles, markRange, ...props }: CalendarProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=calendar.d.ts.map

package/dist/src/components/display/calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACnF;IACI,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,MAAM,EAAE,OAAO,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;CACN,GAAG,CAAC,CAAC,SAAS,MAAM,GAAG;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG,CAAC,SAAS,OAAO,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,GAAG,EAAE,CAAC,GAChI,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CAC3F,CAAC;AAoDF,eAAO,MAAM,QAAQ,4IAYlB,aAAa,4CAgRf,CAAC"}
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACnF;IACI,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,MAAM,EAAE,OAAO,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;CACN,GAAG,CAAC,CAAC,SAAS,MAAM,GACf;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GACtC,CAAC,SAAS,OAAO,GACf;IACI,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,aAAa,CAAC;CAC3B,GACD,EAAE,CAAC,GACP,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CAC3F,CAAC;AAoDF,eAAO,MAAM,QAAQ,mKAclB,aAAa,4CAgRf,CAAC"}

package/dist/src/components/display/calendar.js

@@ -8,7 +8,7 @@ import { Is } from "sidekicker";
 import TheMaskInput from "the-mask-input";
 import { useReducer } from "use-typed-reducer";
 import { useDebounce } from "../../hooks/use-debounce";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { css } from "../../lib/dom";
 import { splitInto } from "../../lib/fns";
 const transition = { type: "spring", bounce: 0.3, duration: 0.6 };
@@ -58,7 +58,7 @@ const inRange = (start, middle, end) => {
         return false;
     return isAfter(middle, start) && isBefore(middle, end);
 };
-export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles, ...props }) => {
+export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, disabledDate, locale, markToday = true, onChangeMonth, onChangeYear, rangeMode = false, onChange, styles, markRange = true, ...props }) => {
     const translate = useTranslations();
     const root = useRef(null);
     const { date, range } = props;
@@ -204,6 +204,6 @@ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, disabledDate,
                                                     const disabledByFn = disabledDate?.(day) || false;
                                                     const disableDate = !isSameMonth(day, state.date) || disabledByFn;
                                                     const isInRange = rangeMode ? inRange(range?.from, day, range?.to) : false;
-                                                    return (_jsxs("td", { align: "center", className: css("relative", styles?.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": rangeMode, onClick: dispatch.onSelectDate, "data-view": state.date.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full font-semibold proportional-nums disabled:cursor-not-allowed ${today ? "text-primary" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, styles?.day, isInRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && state.range.from?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarFromDate }) })) : null, isSelected && state.range.to?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs", children: translate.calendarToDate }) })) : null] }), RenderOnDay ? _jsx(RenderOnDay, { date: day }) : null] }, key));
-                                                }) }, `week-${week.length}-${index}`))) })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "duration-300 transition-transform hover:scale-105", type: "button", onClick: dispatch.setToday, children: "Today" }) })] }) }));
+                                                    return (_jsxs("td", { align: "center", className: css("relative", styles?.dayFrame), children: [_jsxs("button", { type: "button", "data-date": key, disabled: disabledByFn, "data-range": rangeMode, onClick: dispatch.onSelectDate, "data-view": state.date.getMonth().toString(), className: css(`flex size-10 items-center justify-center rounded-full font-semibold proportional-nums disabled:cursor-not-allowed ${today ? "text-primary" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, styles?.day, isInRange && markRange ? "size-10 border border-dashed border-card-border" : ""), children: [day.getDate(), isSelected && state.range.from?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: labelRange?.from ?? translate.calendarFromDate }) })) : null, isSelected && state.range.to?.toISOString() === key ? (_jsx("span", { className: "absolute -top-2 left-0 h-full w-full", children: _jsx("span", { className: "text-xs text-foreground", children: labelRange?.to ?? translate.calendarToDate }) })) : null] }), RenderOnDay ? _jsx(RenderOnDay, { date: day }) : null] }, key));
+                                                }) }, `week-${week.length}-${index}`))) })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "transition-transform duration-300 hover:scale-105", type: "button", onClick: dispatch.setToday, children: "Today" }) })] }) }));
 };

package/dist/src/components/display/notifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAA8C,KAAK,iBAAiB,EAAwD,MAAM,OAAO,CAAC;AAEjJ,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAcb,CAAC;AAEF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAM3F,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAkErE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE3E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,QAAe,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,2CAuDzG"}
+{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAA8C,KAAK,iBAAiB,EAAwD,MAAM,OAAO,CAAC;AAEjJ,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAcb,CAAC;AAEF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CACjD,CAAC,CAAC;AAEH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAM3F,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAiErE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE3E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,QAAe,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,2CAuDzG"}

package/dist/src/components/display/notifications.js

@@ -38,7 +38,7 @@ const Notification = forwardRef(function Toast(props, forwardedRef) {
                 isLast: { y: 10, scale: 1, animationDuration: "300ms", opacity: 1 },
                 hover: { y: 0, position: "static", scale: 1, opacity: 1 },
                 other: animatedIndex[props.reversedIndex] || animatedIndex.default,
-            }, transition: { type: "spring", mass: 1.2, damping: 30, stiffness: 200 }, exit: { opacity: [0.9, 0], transition: { opacity: { bounce: 0.25, duration: 0.3 } } }, children: _jsxs("div", { className: className, children: [_jsxs("div", { className: "flex flex-col p-4", children: [props.title ? (_jsx(RadixToast.Title, { className: "select-text truncate text-lg font-medium leading-relaxed", children: "Title" })) : null, _jsxs(RadixToast.Description, { className: "select-text truncate", children: [props.text, props.index] })] }), closable ? (_jsx(RadixToast.Close, { className: "absolute right-2 top-2 rounded-full p-1 text-foreground transition hover:bg-danger/10 hover:text-danger-hover", children: _jsx(XIcon, { className: "h-5 w-5" }) })) : null] }) }) }));
+            }, transition: { type: "spring", mass: 1.2, damping: 30, stiffness: 200 }, exit: { opacity: [0.9, 0], transition: { opacity: { bounce: 0.25, duration: 0.3 } } }, children: _jsxs("div", { className: className, children: [_jsxs("div", { className: "flex flex-col p-4", children: [props.title ? (_jsx(RadixToast.Title, { className: "select-text truncate text-lg font-medium leading-relaxed", children: "Title" })) : null, _jsx(RadixToast.Description, { className: "select-text truncate", children: props.text })] }), closable ? (_jsx(RadixToast.Close, { className: "absolute right-2 top-2 rounded-full p-1 text-foreground transition hover:bg-danger/10 hover:text-danger-hover", children: _jsx(XIcon, { className: "h-5 w-5" }) })) : null] }) }) }));
 });
 export function Notifications({ children, max = 5, duration = 5000 }) {
     const ref = useRef(null);

package/dist/src/components/display/step.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../../src/components/display/step.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkB,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAmC1D,KAAK,UAAU,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,UAAU,CAAA;CAAE,CAAC;AAkBnF,eAAO,MAAM,cAAc,UAAW,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,4CAK9F,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,SAAS,4CAkDpC,CAAC"}
+{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../../src/components/display/step.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkB,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAmCrE,KAAK,UAAU,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,UAAU,CAAA;CAAE,CAAC;AAkBnF,eAAO,MAAM,cAAc,UAAW,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,4CA2B9F,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,SAAS,4CAkDpC,CAAC"}

package/dist/src/components/display/step.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { motion } from "framer-motion";
-import { useColorParser } from "../../hooks/use-translate-context";
+import { motion, stagger, useAnimate } from "framer-motion";
+import { useEffect } from "react";
+import { useColorParser } from "../../hooks/use-components-provider";
 const iconTransitions = {
     delay: 0.2,
     type: "tween",
@@ -30,11 +31,29 @@ const getCurrentStatus = (props) => {
         return "inactive";
     return "complete";
 };
-export const StepsContainer = (props) => (_jsxs("div", { className: "relative flex justify-between", children: [_jsx("div", { className: "absolute top-1/2 h-1 w-[calc(100%)] bg-card-border" }), props.children] }));
+export const StepsContainer = (props) => {
+    const [ref, animate] = useAnimate();
+    useEffect(() => {
+        if (props.currentStep === 0)
+            return;
+        const container = ref.current;
+        const first = container.querySelectorAll(`div[data-step]`)[0];
+        const step = container.querySelector(`div[data-step="${props.currentStep}"]`);
+        if (first && step) {
+            const diff = step.getBoundingClientRect().left - first.getBoundingClientRect().left;
+            animate("div[data-name='progress']", { width: `${Math.max(0, diff)}px` }, {
+                type: "spring",
+                duration: 0.5,
+                delay: stagger(0.075),
+            });
+        }
+    }, [props.currentStep]);
+    return (_jsxs("div", { className: "relative flex justify-between", ref: ref, children: [_jsx("div", { className: "absolute top-1/2 h-1 w-[calc(100%)] bg-card-border" }), _jsx("div", { "data-name": "progress", className: "absolute top-1/2 h-1 w-0 bg-success" }), props.children] }));
+};
 export const Step = (props) => {
     const parser = useColorParser();
     const status = getCurrentStatus(props);
-    return (_jsxs(motion.div, { animate: status, className: "relative", children: [_jsx(motion.div, { variants: variants, transition: transitions, className: `absolute inset-0 rounded-full ${props.status === "error" ? "bg-danger" : ""}` }), _jsx(motion.div, { initial: false, variants: {
+    return (_jsxs(motion.div, { "data-step": props.step, animate: status, className: "relative", children: [_jsx(motion.div, { variants: variants, transition: transitions, className: `absolute inset-0 rounded-full ${props.status === "error" ? "bg-danger" : ""}` }), _jsx(motion.div, { initial: false, variants: {
                     error: {
                         backgroundColor: parser("var(--danger-DEFAULT)"),
                         borderColor: parser("var(--danger-hover)"),

package/dist/src/components/floating/menu.d.ts

@@ -26,7 +26,7 @@ type MenuItemProps = {
     Right?: React.FC<LucideProps>;
 };
 export declare const MenuItem: React.ForwardRefExoticComponent<Override<React.ButtonHTMLAttributes<HTMLButtonElement>, MenuItemProps> & React.RefAttributes<HTMLButtonElement>>;
-export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent" | "asChild"> & Partial<{
+export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "asChild" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent"> & Partial<{
     FloatingComponent: React.ElementType;
     floatingClassName: string;
     hover: boolean;
@@ -36,7 +36,7 @@ export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.Deta
     children: React.ReactNode;
 } & {
     label: string;
-}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent" | "asChild"> & Partial<{
+}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "asChild" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent"> & Partial<{
     FloatingComponent: React.ElementType;
     floatingClassName: string;
     hover: boolean;

package/dist/src/components/form/autocomplete.js

@@ -5,7 +5,7 @@ import { autoUpdate, FloatingFocusManager, FloatingPortal, offset, size, useDism
 import Fuzzy from "fuzzy-search";
 import { CheckIcon, ChevronDown } from "lucide-react";
 import { forwardRef, Fragment, useEffect, useRef, useState } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { css, dispatchInput, initializeInputDataset } from "../../lib/dom";
 import { safeRegex } from "../../lib/fns";
 import { InputField } from "./input-field";

package/dist/src/components/form/date-picker.d.ts

@@ -3,8 +3,13 @@ import { Override } from "../../types";
 import { CalendarProps } from "../display/calendar";
 import { InputProps } from "./input";
 export type DatePickerProps = Override<InputProps, CalendarProps<"date">>;
-export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
+export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<InputProps, "onChange" | "date" | "locale" | "labelRange" | "markRange" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
+    labelRange: {
+        to: string;
+        from: string;
+    };
     locale: import("the-mask-input").Locales;
+    markRange: boolean;
     markToday: boolean;
     rangeMode: boolean;
     changeOnlyOnClick: boolean;
@@ -27,8 +32,13 @@ export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<Omit<Inpu
 } & {
     date: Date;
     onChange: (d: Date | undefined) => void;
-}>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
+}>, "ref"> | Omit<Omit<InputProps, "onChange" | "date" | "locale" | "labelRange" | "markRange" | "markToday" | "rangeMode" | "changeOnlyOnClick" | "onChangeMonth" | "onChangeYear" | "RenderOnDay" | "disabledDate" | "styles"> & Partial<{
+    labelRange: {
+        to: string;
+        from: string;
+    };
     locale: import("the-mask-input").Locales;
+    markRange: boolean;
     markToday: boolean;
     rangeMode: boolean;
     changeOnlyOnClick: boolean;

package/dist/src/components/form/date-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/form/date-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAG9E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAY,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE9D,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;AAmC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oDA0GtB,CAAC"}
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/components/form/date-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAG9E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAY,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE9D,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;AAmC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oDA4GtB,CAAC"}

package/dist/src/components/form/date-picker.js

@@ -3,7 +3,7 @@ import { format, isValid, parse, startOfDay } from "date-fns";
 import { CalendarIcon } from "lucide-react";
 import { forwardRef, Fragment, useId, useMemo, useState } from "react";
 import { Is } from "sidekicker";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useLocale, useTranslations } from "../../hooks/use-components-provider";
 import { Calendar } from "../display/calendar";
 import { Dropdown } from "../floating/dropdown";
 import { Input } from "./input";
@@ -34,7 +34,8 @@ const formatParts = (datetimeFormat, date) => {
         return [];
     }
 };
-export const DatePicker = forwardRef(({ date, locale, disabledDate, onChange, markToday, ...props }, externalRef) => {
+export const DatePicker = forwardRef(({ date, locale: inputLocal, disabledDate, onChange, markToday, ...props }, externalRef) => {
+    const locale = inputLocal || useLocale();
     const labelId = useId();
     const translation = useTranslations();
     const datetimeFormat = useMemo(() => new Intl.DateTimeFormat(locale), [locale]);
@@ -42,6 +43,7 @@ export const DatePicker = forwardRef(({ date, locale, disabledDate, onChange, ma
     const [open, setOpen] = useState(false);
     const mask = formatParts(datetimeFormat, fixedDate).flatMap((x) => (Is.keyof(parts, x.type) ? parts[x.type](x.value) : []));
     const placeholder = formatParts(datetimeFormat, fixedDate).reduce((acc, x) => acc + (Is.keyof(placeholders, x.type) ? placeholders[x.type](x.value) : ""), "");
+    console.log({ locale, datetimeFormat, placeholder });
     const [value, setValue] = useState(!innerDate
         ? ""
         : formatParts(datetimeFormat, innerDate).reduce((acc, x) => acc + (Is.keyof(parts, x.type) ? partValues[x.type](innerDate, x.value) : ""), ""));

package/dist/src/components/form/input-field.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CheckCircle, InfoIcon, XCircle } from "lucide-react";
 import { Fragment } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { css } from "../../lib/dom";
 import { Tooltip } from "../floating/tooltip";
 export const InputFeedback = ({ reportStatus, hideLeft = false, className, info, children, title }) => (_jsxs("div", { className: css("w-full justify-between", hideLeft && children === null ? "hidden" : "flex", className), children: [hideLeft ? null : (_jsxs("span", { className: "flex items-center gap-1 transition-colors group-focus-within:text-primary group-hover:text-primary group-error:text-danger", children: [title, reportStatus || info ? (_jsxs("span", { className: "flex items-center justify-center gap-1", children: [info ? (_jsx(Tooltip, { title: _jsxs("span", { className: "cursor-help", children: [_jsx("span", { className: "sr-only", children: info }), _jsx(InfoIcon, { className: "aspect-square size-3", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] }), children: info })) : null, reportStatus ? (_jsxs(Fragment, { children: [_jsx(CheckCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true }), _jsx(XCircle, { className: "hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] })) : null] })) : null] })), children] }));

package/dist/src/components/form/select.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChevronDownIcon } from "lucide-react";
 import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { css, initializeInputDataset, mergeRefs } from "../../lib/dom";
 import { InputField } from "./input-field";
 export const Select = forwardRef(({ required = true, options, info, selectContainer = "", feedback = null, labelClassName, interactive, rightLabel, optionalText, container, hideLeft = false, right, left, error, ...props }, ref) => {

package/dist/src/components/index.d.ts

@@ -1,9 +1,11 @@
 export * from "./core/button";
 export * from "./core/polymorph";
+export * from "./core/render-on-view";
 export * from "./core/tag";
 export * from "./display/alert";
 export * from "./display/calendar";
 export * from "./display/card";
+export * from "./display/notifications";
 export * from "./display/stats";
 export * from "./display/tabs";
 export * from "./floating/dropdown";
@@ -21,7 +23,6 @@ export * from "./form/input";
 export * from "./form/input-field";
 export * from "./form/radiobox";
 export * from "./form/select";
-export * from "./form/select";
 export * from "./form/switch";
 export * from "./form/task-list";
 export * from "./form/transfer-list";

package/dist/src/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,OAAO,EAAE,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,OAAO,EAAE,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/src/components/index.js

@@ -1,9 +1,11 @@
 export * from "./core/button";
 export * from "./core/polymorph";
+export * from "./core/render-on-view";
 export * from "./core/tag";
 export * from "./display/alert";
 export * from "./display/calendar";
 export * from "./display/card";
+export * from "./display/notifications";
 export * from "./display/stats";
 export * from "./display/tabs";
 export * from "./floating/dropdown";
@@ -21,7 +23,6 @@ export * from "./form/input";
 export * from "./form/input-field";
 export * from "./form/radiobox";
 export * from "./form/select";
-export * from "./form/select";
 export * from "./form/switch";
 export * from "./form/task-list";
 export * from "./form/transfer-list";

package/dist/src/components/table/filter.js

@@ -6,7 +6,7 @@ import { Dropdown } from "../floating/dropdown";
 import { Input } from "../form/input";
 import { Select } from "../form/select";
 import { ColType, getLabel, valueFromType } from "./table-lib";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 export const createFilterFromCol = (f, options, operations, rest = {}) => {
     const name = f.id;
     const type = f.type ?? ColType.Text;

package/dist/src/components/table/group.js

@@ -5,7 +5,7 @@ import Linq from "linq-arrays";
 import { GripVerticalIcon, Trash2Icon, UngroupIcon } from "lucide-react";
 import { Fragment, useState } from "react";
 import { keys } from "sidekicker";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { uuid } from "../../lib/fns";
 import { Button } from "../core/button";
 import { Dropdown } from "../floating/dropdown";

package/dist/src/components/table/pagination.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, useId, useMemo } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 function createPaginationItems(current, max) {
     if (!current || !max)
         return [];

package/dist/src/components/table/sort.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ArrowDown01Icon, ArrowUp01Icon, ArrowUpDownIcon, PlusIcon, Trash2Icon } from "lucide-react";
 import { Fragment, useEffect, useState } from "react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { uuid } from "../../lib/fns";
 import { Dropdown } from "../floating/dropdown";
 import { Select } from "../form/select";

package/dist/src/components/table/thead.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AnimatePresence, Reorder } from "framer-motion";
 import { Order } from "linq-arrays";
 import { PlusIcon, SearchCheckIcon, SearchXIcon } from "lucide-react";
-import { useTranslations } from "../../hooks/use-translate-context";
+import { useTranslations } from "../../hooks/use-components-provider";
 import { Dropdown } from "../floating/dropdown";
 import { ColumnHeaderFilter, createFilterFromCol, useOperators } from "./filter";
 import { SorterHead } from "./sort";

package/dist/src/hooks/{use-translate-context.d.ts → use-components-provider.d.ts}

@@ -1,5 +1,6 @@
 import React, { PropsWithChildren } from "react";
 import { parsers } from "../../preset.tailwind";
+import { Locales } from "the-mask-input";
 declare const defaultTranslations: {
     inputCaretDown: string;
     datePickerCalendarButtonLabel: string;
@@ -47,11 +48,13 @@ declare const defaultTranslations: {
     calendarToDate: string;
 };
 type Translations = typeof defaultTranslations;
-type ContextProps = {
-    parser?: typeof parsers.hsla;
-    map?: Partial<Translations>;
-};
+type ContextProps = Partial<{
+    map: Partial<Translations>;
+    locale: Locales | undefined;
+    parser: typeof parsers.hsla;
+}>;
 export declare const ComponentsProvider: (props: PropsWithChildren<ContextProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const useLocale: () => Locales | undefined;
 export declare const useTranslations: () => {
     inputCaretDown: string;
     datePickerCalendarButtonLabel: string;
@@ -100,4 +103,4 @@ export declare const useTranslations: () => {
 };
 export declare const useColorParser: () => (v: string) => `hsla(${string})`;
 export {};
-//# sourceMappingURL=use-translate-context.d.ts.map
+//# sourceMappingURL=use-components-provider.d.ts.map

package/dist/src/hooks/use-components-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-components-provider.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-components-provider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAA2B,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA4Ce;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;CASxI,CAAC;AAEF,KAAK,YAAY,GAAG,OAAO,mBAAmB,CAAC;AAQ/C,KAAK,YAAY,GAAG,OAAO,CAAC;IACxB,GAAG,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC3B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,MAAM,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;CAC/B,CAAC,CAAC;AAEH,eAAO,MAAM,kBAAkB,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CAUxE,CAAC;AAEF,eAAO,MAAM,SAAS,QAAO,OAAO,GAAG,SAItC,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA3CY;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;CA+CxI,CAAC;AAEF,eAAO,MAAM,cAAc,wCAI1B,CAAC"}

package/dist/src/hooks/{use-translate-context.js → use-components-provider.js}

@@ -1,3 +1,4 @@
+"use client";
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { createContext, Fragment, useContext, useMemo } from "react";
 import { parsers } from "../../preset.tailwind";
@@ -41,14 +42,25 @@ const defaultTranslations = {
     calendarFromDate: "From",
     calendarToDate: "To",
 };
-const Context = createContext({ translations: defaultTranslations, colorTokenParser: parsers.hsla });
+const Context = createContext({
+    colorTokenParser: parsers.hsla,
+    translations: defaultTranslations,
+    locale: undefined,
+});
 export const ComponentsProvider = (props) => {
     const memoMap = useMemo(() => ({
+        locale: props.locale,
         translations: { ...defaultTranslations, ...props.map },
         colorTokenParser: props.parser || parsers.hsla,
-    }), [props.map]);
+    }), [props]);
     return _jsx(Context.Provider, { value: memoMap, children: props.children });
 };
+export const useLocale = () => {
+    const ctx = useContext(Context);
+    if (!ctx)
+        return undefined;
+    return ctx.locale;
+};
 export const useTranslations = () => {
     const ctx = useContext(Context);
     if (!ctx)

package/dist/src/index.d.ts

@@ -2,7 +2,7 @@ export * from "./components";
 export * from "./hooks/use-form";
 export * from "./hooks/use-previous";
 export * from "./hooks/use-reactive";
-export { ComponentsProvider, useTranslations } from "./hooks/use-translate-context";
+export { ComponentsProvider, useTranslations } from "./hooks/use-components-provider";
 export * from "./lib/dom";
 export * from "./lib/fns";
 export * from "./styles/theme";

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AACpF,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC;AACvC,mBAAmB,SAAS,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AACtF,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,wBAAwB,CAAC;AACvC,mBAAmB,SAAS,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/src/index.js

@@ -2,7 +2,7 @@ export * from "./components";
 export * from "./hooks/use-form";
 export * from "./hooks/use-previous";
 export * from "./hooks/use-reactive";
-export { ComponentsProvider, useTranslations } from "./hooks/use-translate-context";
+export { ComponentsProvider, useTranslations } from "./hooks/use-components-provider";
 export * from "./lib/dom";
 export * from "./lib/fns";
 export * from "./styles/theme";

package/dist/src/types.d.ts

@@ -7,4 +7,5 @@ export type Override<Source, New> = Omit<Source, keyof New> & New;
 export type SetState<T> = Dispatch<SetStateAction<T>>;
 export type POJO = {};
 export type ComponentLike = keyof JSX.IntrinsicElements | JSXElementConstructor<any>;
+export type Any = Record<string, any>;
 //# sourceMappingURL=types.d.ts.map

package/dist/src/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpF,MAAM,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;AAEvE,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAE,GAAG,EAAE,CAAC;AAErD,MAAM,MAAM,QAAQ,CAAC,MAAM,EAAE,GAAG,IAAI,IAAI,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,GAAG,GAAG,CAAC;AAElE,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtD,MAAM,MAAM,IAAI,GAAG,EAAE,CAAC;AAEtB,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,CAAC,iBAAiB,GAAG,qBAAqB,CAAC,GAAG,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpF,MAAM,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC,OAAO,CAAC;AAEvE,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAE,GAAG,EAAE,CAAC;AAErD,MAAM,MAAM,QAAQ,CAAC,MAAM,EAAE,GAAG,IAAI,IAAI,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,GAAG,GAAG,CAAC;AAElE,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtD,MAAM,MAAM,IAAI,GAAG,EAAE,CAAC;AAEtB,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,CAAC,iBAAiB,GAAG,qBAAqB,CAAC,GAAG,CAAC,CAAC;AAErF,MAAM,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@g4rcez/components",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "sideEffects": false,
   "private": false,
   "packageManager": "pnpm@8.15.3",

package/dist/src/hooks/use-translate-context.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-translate-context.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-translate-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA2B,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA4Ce;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;CASxI,CAAC;AAEF,KAAK,YAAY,GAAG,OAAO,mBAAmB,CAAC;AAI/C,KAAK,YAAY,GAAG;IAChB,MAAM,CAAC,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;IAC7B,GAAG,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,kBAAkB,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CASxE,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wCA/BY;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;KAAE;;;CAmCxI,CAAC;AAEF,eAAO,MAAM,cAAc,wCAI1B,CAAC"}