@g4rcez/components 5.0.1 → 5.0.3

package/dist/components/form/slider.jsx

@@ -0,0 +1,45 @@
+"use client";
+import { Slider as Base } from "@base-ui/react/slider";
+import { Is } from "sidekicker";
+import { css } from "../../lib/dom";
+import { Tooltip } from "../floating/tooltip";
+import { useEffect, useRef, useState } from "react";
+import { uuid } from "../../lib/fns";
+import { useLocale } from "../../hooks/use-locale";
+const Thumb = (props) => {
+    const [float, setFloat] = useState(null);
+    const ref = useRef(null);
+    useEffect(() => {
+        const html = ref.current;
+        if (html === null)
+            return;
+        const initialValue = Number(html.getAttribute("aria-valuenow"));
+        if (Is.number(initialValue)) {
+            setFloat(initialValue);
+        }
+        const observer = new MutationObserver((changes) => {
+            const span = changes[0].target;
+            const value = Number(span.getAttribute("aria-valuenow"));
+            setFloat(Is.number(value) ? value : null);
+        });
+        observer.observe(html, { attributeFilter: ["aria-valuenow"] });
+        return () => observer.disconnect();
+    }, []);
+    return (<Tooltip title="" ref={ref} as={Base.Thumb} enabled={props.tooltip} className="focus-within::scale-105 block size-slider-thumb-size cursor-grab rounded-full border-2 border-input-border bg-input-switch shadow-shadow-floating focus-within:border-primary focus-within:outline active:cursor-grabbing">
+            {float}
+        </Tooltip>);
+};
+export const Slider = (props) => {
+    const { tooltip, className, defaultValue, value, ...restProps } = props;
+    const id = useRef(uuid());
+    const array = defaultValue || value || [];
+    const locale = useLocale();
+    return (<Base.Root {...restProps} value={value} locale={locale} defaultValue={defaultValue}>
+            <Base.Control className={css("relative flex h-slider-control-h w-full touch-none select-none items-center", className)}>
+                <Base.Track className="relative h-slider-track-h grow rounded-full bg-background">
+                    <Base.Indicator className="absolute h-full rounded-full bg-primary"/>
+                </Base.Track>
+                {Array.isArray(array) ? array.map((_, i) => <Thumb tooltip={tooltip ?? false} key={`${id.current}-${i}`}/>) : null}
+            </Base.Control>
+        </Base.Root>);
+};

package/dist/components/form/switch.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export type SwitchProps = Omit<React.ComponentProps<"input">, "onKeyDown"> & {
+    error?: string;
+    loading?: boolean;
+    container?: string;
+    onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;
+    onCheck?: (nextValue: boolean) => void;
+};
+export declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=switch.d.ts.map

package/dist/components/form/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/form/switch.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8E,MAAM,OAAO,CAAC;AAInG,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,GAAG;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IAC1D,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,MAAM,mGA2FlB,CAAC"}

package/dist/components/form/switch.js

@@ -4,58 +4,63 @@ import { t } from "../../use-stable-ref-D5LFCx0u.js";
 import { forwardRef as n, useEffect as r, useId as i, useImperativeHandle as a, useRef as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/form/switch.tsx
-var u = n(({ children: n, loading: u, container: d, error: f, ...p }, m) => {
-	let h = i(), [g, _] = s(p.checked ?? !1), v = g, y = o(null), b = t(p.onChange);
-	a(m, () => y.current), r(() => {
-		if (y.current !== null && b.current) {
+var u = n(({ children: n, loading: u, container: d, error: f, onKeyDown: p, onCheck: m, ...h }, g) => {
+	let _ = i(), v = f ? `${h.id || _}-error` : void 0, y = [h["aria-describedby"], v].filter(Boolean).join(" ") || void 0, b = f ? !0 : h["aria-invalid"], [x, S] = s(h.checked ?? !1), C = x, w = o(null), T = t(h.onChange);
+	a(g, () => w.current), r(() => {
+		if (w.current !== null && T.current) {
 			let e = (e) => {
-				b.current && b.current(e);
-			}, t = y.current;
+				T.current && T.current(e);
+			}, t = w.current;
 			return t.addEventListener("change", e), () => t?.removeEventListener("change", e);
 		}
-	}, [b]);
-	let x = () => {
-		let e = !y.current?.checked;
-		_(e), p?.onCheck?.(e), y.current !== null && (y.current.checked = e, y.current.dispatchEvent(new Event("change", { bubbles: !0 })));
+	}, [T]);
+	let E = () => {
+		let e = !w.current?.checked;
+		S(e), m?.(e), w.current !== null && (w.current.checked = e, w.current.dispatchEvent(new Event("change", { bubbles: !0 })));
 	};
 	return /* @__PURE__ */ l("fieldset", {
 		className: e("flex flex-col flex-wrap justify-center", d),
 		"data-component": "switch",
-		disabled: p.disabled || u,
+		disabled: h.disabled || u,
 		children: [/* @__PURE__ */ l("span", {
 			className: "flex flex-row flex-wrap items-center",
 			children: [
 				/* @__PURE__ */ c("input", {
-					...p,
+					...h,
 					hidden: !0,
-					ref: y,
+					ref: w,
 					type: "checkbox",
-					checked: v,
-					id: p.id || h,
+					checked: C,
+					id: h.id || _,
 					"data-trigger": "change",
-					"data-checked": v,
-					disabled: p.disabled || u,
-					onChange: (e) => _(e.target.checked)
+					"data-checked": C,
+					disabled: h.disabled || u,
+					onChange: (e) => S(e.target.checked)
 				}),
 				/* @__PURE__ */ c("button", {
 					role: "switch",
 					type: "button",
-					onClick: x,
-					"aria-checked": v,
-					"data-checked": v,
-					"aria-labelledby": `${h}-label`,
-					disabled: p.disabled || u,
+					onClick: E,
+					onKeyDown: (e) => {
+						p?.(e), !e.defaultPrevented && (e.key === " " || e.key === "Space" || e.code === "Space" || e.key === "Enter") && (e.preventDefault(), E());
+					},
+					"aria-checked": C,
+					"aria-invalid": b,
+					"aria-describedby": y,
+					"data-checked": C,
+					"aria-labelledby": `${_}-label`,
+					disabled: h.disabled || u,
 					className: "relative inline-flex h-switch-track-h w-switch-track-w flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-300 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary",
 					children: /* @__PURE__ */ c("span", {
 						"aria-hidden": "true",
-						"data-checked": v,
+						"data-checked": C,
 						className: "inline-block aspect-square size-switch-thumb-size transform rounded-full shadow ring-0 transition duration-300 ease-in-out data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch"
 					})
 				}),
 				/* @__PURE__ */ c("label", {
-					htmlFor: p.id || h,
+					htmlFor: h.id || _,
 					className: "ml-switch-gap inline-block text-switch-label-text",
-					id: `${h}-label`,
+					id: `${_}-label`,
 					children: /* @__PURE__ */ c("span", {
 						className: "font-medium text-foreground",
 						children: n
@@ -63,6 +68,7 @@ var u = n(({ children: n, loading: u, container: d, error: f, ...p }, m) => {
 				})
 			]
 		}), /* @__PURE__ */ c("span", {
+			id: v,
 			className: "mt-switch-hint-mt flex-1 whitespace-nowrap text-switch-hint-text text-danger empty:mt-0 empty:hidden",
 			children: f
 		})]

package/dist/components/form/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","names":[],"sources":["../../../src/components/form/switch.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from \"react\";\nimport { useStableRef } from \"../../hooks/use-stable-ref\";\nimport { css } from \"../../lib/dom\";\n\nexport type SwitchProps = React.ComponentProps<\"input\"> & {\n    error?: string;\n    loading?: boolean;\n    container?: string;\n    onCheck?: (nextValue: boolean) => void;\n};\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(({ children, loading, container, error, ...props }: SwitchProps, ref) => {\n    const id = useId();\n    const [innerChecked, setInnerChecked] = useState(props.checked ?? false);\n    const checked = innerChecked;\n    const innerRef = useRef<HTMLInputElement>(null);\n    const stableOnChange = useStableRef(props.onChange);\n    useImperativeHandle(ref, () => innerRef.current!);\n\n    useEffect(() => {\n        if (innerRef.current !== null) {\n            if (stableOnChange.current) {\n                const onChange = (e: Event) => {\n                    if (stableOnChange.current) stableOnChange.current(e as unknown as React.ChangeEvent<HTMLInputElement>);\n                };\n                const ref = innerRef.current;\n                ref.addEventListener(\"change\", onChange);\n                return () => ref?.removeEventListener(\"change\", onChange);\n            }\n        }\n    }, [stableOnChange]);\n\n    const onCheck = () => {\n        const checked = !innerRef.current?.checked;\n        setInnerChecked(checked);\n        props?.onCheck?.(checked);\n        if (innerRef.current !== null) {\n            innerRef.current.checked = checked;\n            innerRef.current.dispatchEvent(new Event(\"change\", { bubbles: true }));\n        }\n    };\n\n    return (\n        <fieldset className={css(\"flex flex-col flex-wrap justify-center\", container)} data-component=\"switch\" disabled={props.disabled || loading}>\n            <span className=\"flex flex-row flex-wrap items-center\">\n                <input\n                    {...props}\n                    hidden\n                    ref={innerRef}\n                    type=\"checkbox\"\n                    checked={checked}\n                    id={props.id || id}\n                    data-trigger=\"change\"\n                    data-checked={checked}\n                    disabled={props.disabled || loading}\n                    onChange={(e) => setInnerChecked(e.target.checked)}\n                />\n                <button\n                    role=\"switch\"\n                    type=\"button\"\n                    onClick={onCheck}\n                    aria-checked={checked}\n                    data-checked={checked}\n                    aria-labelledby={`${id}-label`}\n                    disabled={props.disabled || loading}\n                    className=\"relative inline-flex h-switch-track-h w-switch-track-w flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-300 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary\"\n                >\n                    <span\n                        aria-hidden=\"true\"\n                        data-checked={checked}\n                        className=\"inline-block aspect-square size-switch-thumb-size transform rounded-full shadow ring-0 transition duration-300 ease-in-out data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch\"\n                    />\n                </button>\n                <label htmlFor={props.id || id} className=\"ml-switch-gap inline-block text-switch-label-text\" id={`${id}-label`}>\n                    <span className=\"font-medium text-foreground\">{children}</span>\n                </label>\n            </span>\n            <span className=\"mt-switch-hint-mt flex-1 whitespace-nowrap text-switch-hint-text text-danger empty:mt-0 empty:hidden\">{error}</span>\n        </fieldset>\n    );\n});\n"],"mappings":";;;;;;AAYA,IAAa,IAAS,GAA2C,EAAE,aAAU,YAAS,cAAW,UAAO,GAAG,KAAsB,MAAQ;CACrI,IAAM,IAAK,EAAM,GACX,CAAC,GAAc,KAAmB,EAAS,EAAM,WAAW,EAAK,GACjE,IAAU,GACV,IAAW,EAAyB,IAAI,GACxC,IAAiB,EAAa,EAAM,QAAQ;CAGlD,AAFA,EAAoB,SAAW,EAAS,OAAQ,GAEhD,QAAgB;EACZ,IAAI,EAAS,YAAY,QACjB,EAAe,SAAS;GACxB,IAAM,KAAY,MAAa;IAC3B,AAAI,EAAe,WAAS,EAAe,QAAQ,CAAmD;GAC1G,GACM,IAAM,EAAS;GAErB,OADA,EAAI,iBAAiB,UAAU,CAAQ,SAC1B,GAAK,oBAAoB,UAAU,CAAQ;EAC5D;CAER,GAAG,CAAC,CAAc,CAAC;CAEnB,IAAM,UAAgB;EAClB,IAAM,IAAU,CAAC,EAAS,SAAS;EAGnC,AAFA,EAAgB,CAAO,GACvB,GAAO,UAAU,CAAO,GACpB,EAAS,YAAY,SACrB,EAAS,QAAQ,UAAU,GAC3B,EAAS,QAAQ,cAAc,IAAI,MAAM,UAAU,EAAE,SAAS,GAAK,CAAC,CAAC;CAE7E;CAEA,OACI,kBAAC,YAAD;EAAU,WAAW,EAAI,0CAA0C,CAAS;EAAG,kBAAe;EAAS,UAAU,EAAM,YAAY;YAAnI,CACI,kBAAC,QAAD;GAAM,WAAU;aAAhB;IACI,kBAAC,SAAD;KACI,GAAI;KACJ,QAAA;KACA,KAAK;KACL,MAAK;KACI;KACT,IAAI,EAAM,MAAM;KAChB,gBAAa;KACb,gBAAc;KACd,UAAU,EAAM,YAAY;KAC5B,WAAW,MAAM,EAAgB,EAAE,OAAO,OAAO;IACpD,CAAA;IACD,kBAAC,UAAD;KACI,MAAK;KACL,MAAK;KACL,SAAS;KACT,gBAAc;KACd,gBAAc;KACd,mBAAiB,GAAG,EAAG;KACvB,UAAU,EAAM,YAAY;KAC5B,WAAU;eAEV,kBAAC,QAAD;MACI,eAAY;MACZ,gBAAc;MACd,WAAU;KACb,CAAA;IACG,CAAA;IACR,kBAAC,SAAD;KAAO,SAAS,EAAM,MAAM;KAAI,WAAU;KAAoD,IAAI,GAAG,EAAG;eACpG,kBAAC,QAAD;MAAM,WAAU;MAA+B;KAAe,CAAA;IAC3D,CAAA;GACL;MACN,kBAAC,QAAD;GAAM,WAAU;aAAwG;EAAY,CAAA,CAC9H;;AAElB,CAAC"}
+{"version":3,"file":"switch.js","names":[],"sources":["../../../src/components/form/switch.tsx"],"sourcesContent":["\"use client\";\nimport React, { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from \"react\";\nimport { useStableRef } from \"../../hooks/use-stable-ref\";\nimport { css } from \"../../lib/dom\";\n\nexport type SwitchProps = Omit<React.ComponentProps<\"input\">, \"onKeyDown\"> & {\n    error?: string;\n    loading?: boolean;\n    container?: string;\n    onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n    onCheck?: (nextValue: boolean) => void;\n};\n\nexport const Switch = forwardRef<HTMLInputElement, SwitchProps>(\n    ({ children, loading, container, error, onKeyDown, onCheck: onCheckProp, ...props }: SwitchProps, ref) => {\n        const id = useId();\n        const errorId = error ? `${props.id || id}-error` : undefined;\n        const describedBy = [props[\"aria-describedby\"], errorId].filter(Boolean).join(\" \") || undefined;\n        const ariaInvalid = error ? true : props[\"aria-invalid\"];\n        const [innerChecked, setInnerChecked] = useState(props.checked ?? false);\n        const checked = innerChecked;\n        const innerRef = useRef<HTMLInputElement>(null);\n        const stableOnChange = useStableRef(props.onChange);\n        useImperativeHandle(ref, () => innerRef.current!);\n\n        useEffect(() => {\n            if (innerRef.current !== null) {\n                if (stableOnChange.current) {\n                    const onChange = (e: Event) => {\n                        if (stableOnChange.current) stableOnChange.current(e as unknown as React.ChangeEvent<HTMLInputElement>);\n                    };\n                    const ref = innerRef.current;\n                    ref.addEventListener(\"change\", onChange);\n                    return () => ref?.removeEventListener(\"change\", onChange);\n                }\n            }\n        }, [stableOnChange]);\n\n        const onCheck = () => {\n            const checked = !innerRef.current?.checked;\n            setInnerChecked(checked);\n            onCheckProp?.(checked);\n            if (innerRef.current !== null) {\n                innerRef.current.checked = checked;\n                innerRef.current.dispatchEvent(new Event(\"change\", { bubbles: true }));\n            }\n        };\n\n        return (\n            <fieldset\n                className={css(\"flex flex-col flex-wrap justify-center\", container)}\n                data-component=\"switch\"\n                disabled={props.disabled || loading}\n            >\n                <span className=\"flex flex-row flex-wrap items-center\">\n                    <input\n                        {...props}\n                        hidden\n                        ref={innerRef}\n                        type=\"checkbox\"\n                        checked={checked}\n                        id={props.id || id}\n                        data-trigger=\"change\"\n                        data-checked={checked}\n                        disabled={props.disabled || loading}\n                        onChange={(e) => setInnerChecked(e.target.checked)}\n                    />\n                    <button\n                        role=\"switch\"\n                        type=\"button\"\n                        onClick={onCheck}\n                        onKeyDown={(event) => {\n                            onKeyDown?.(event);\n\n                            if (event.defaultPrevented) return;\n                            if (event.key === \" \" || event.key === \"Space\" || event.code === \"Space\" || event.key === \"Enter\") {\n                                event.preventDefault();\n                                onCheck();\n                            }\n                        }}\n                        aria-checked={checked}\n                        aria-invalid={ariaInvalid}\n                        aria-describedby={describedBy}\n                        data-checked={checked}\n                        aria-labelledby={`${id}-label`}\n                        disabled={props.disabled || loading}\n                        className=\"relative inline-flex h-switch-track-h w-switch-track-w flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-300 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary\"\n                    >\n                        <span\n                            aria-hidden=\"true\"\n                            data-checked={checked}\n                            className=\"inline-block aspect-square size-switch-thumb-size transform rounded-full shadow ring-0 transition duration-300 ease-in-out data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch\"\n                        />\n                    </button>\n                    <label htmlFor={props.id || id} className=\"ml-switch-gap inline-block text-switch-label-text\" id={`${id}-label`}>\n                        <span className=\"font-medium text-foreground\">{children}</span>\n                    </label>\n                </span>\n                <span id={errorId} className=\"mt-switch-hint-mt flex-1 whitespace-nowrap text-switch-hint-text text-danger empty:mt-0 empty:hidden\">\n                    {error}\n                </span>\n            </fieldset>\n        );\n    }\n);\n"],"mappings":";;;;;;AAaA,IAAa,IAAS,GACjB,EAAE,aAAU,YAAS,cAAW,UAAO,cAAW,SAAS,GAAa,GAAG,KAAsB,MAAQ;CACtG,IAAM,IAAK,EAAM,GACX,IAAU,IAAQ,GAAG,EAAM,MAAM,EAAG,UAAU,KAAA,GAC9C,IAAc,CAAC,EAAM,qBAAqB,CAAO,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK,KAAA,GAChF,IAAc,IAAQ,KAAO,EAAM,iBACnC,CAAC,GAAc,KAAmB,EAAS,EAAM,WAAW,EAAK,GACjE,IAAU,GACV,IAAW,EAAyB,IAAI,GACxC,IAAiB,EAAa,EAAM,QAAQ;CAGlD,AAFA,EAAoB,SAAW,EAAS,OAAQ,GAEhD,QAAgB;EACZ,IAAI,EAAS,YAAY,QACjB,EAAe,SAAS;GACxB,IAAM,KAAY,MAAa;IAC3B,AAAI,EAAe,WAAS,EAAe,QAAQ,CAAmD;GAC1G,GACM,IAAM,EAAS;GAErB,OADA,EAAI,iBAAiB,UAAU,CAAQ,SAC1B,GAAK,oBAAoB,UAAU,CAAQ;EAC5D;CAER,GAAG,CAAC,CAAc,CAAC;CAEnB,IAAM,UAAgB;EAClB,IAAM,IAAU,CAAC,EAAS,SAAS;EAGnC,AAFA,EAAgB,CAAO,GACvB,IAAc,CAAO,GACjB,EAAS,YAAY,SACrB,EAAS,QAAQ,UAAU,GAC3B,EAAS,QAAQ,cAAc,IAAI,MAAM,UAAU,EAAE,SAAS,GAAK,CAAC,CAAC;CAE7E;CAEA,OACI,kBAAC,YAAD;EACI,WAAW,EAAI,0CAA0C,CAAS;EAClE,kBAAe;EACf,UAAU,EAAM,YAAY;YAHhC,CAKI,kBAAC,QAAD;GAAM,WAAU;aAAhB;IACI,kBAAC,SAAD;KACI,GAAI;KACJ,QAAA;KACA,KAAK;KACL,MAAK;KACI;KACT,IAAI,EAAM,MAAM;KAChB,gBAAa;KACb,gBAAc;KACd,UAAU,EAAM,YAAY;KAC5B,WAAW,MAAM,EAAgB,EAAE,OAAO,OAAO;IACpD,CAAA;IACD,kBAAC,UAAD;KACI,MAAK;KACL,MAAK;KACL,SAAS;KACT,YAAY,MAAU;MAClB,IAAY,CAAK,GAEb,GAAM,qBACN,EAAM,QAAQ,OAAO,EAAM,QAAQ,WAAW,EAAM,SAAS,WAAW,EAAM,QAAQ,aACtF,EAAM,eAAe,GACrB,EAAQ;KAEhB;KACA,gBAAc;KACd,gBAAc;KACd,oBAAkB;KAClB,gBAAc;KACd,mBAAiB,GAAG,EAAG;KACvB,UAAU,EAAM,YAAY;KAC5B,WAAU;eAEV,kBAAC,QAAD;MACI,eAAY;MACZ,gBAAc;MACd,WAAU;KACb,CAAA;IACG,CAAA;IACR,kBAAC,SAAD;KAAO,SAAS,EAAM,MAAM;KAAI,WAAU;KAAoD,IAAI,GAAG,EAAG;eACpG,kBAAC,QAAD;MAAM,WAAU;MAA+B;KAAe,CAAA;IAC3D,CAAA;GACL;MACN,kBAAC,QAAD;GAAM,IAAI;GAAS,WAAU;aACxB;EACC,CAAA,CACA;;AAElB,CACJ"}

package/dist/components/form/switch.jsx

@@ -0,0 +1,59 @@
+"use client";
+import React, { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from "react";
+import { useStableRef } from "../../hooks/use-stable-ref";
+import { css } from "../../lib/dom";
+export const Switch = forwardRef(({ children, loading, container, error, onKeyDown, onCheck: onCheckProp, ...props }, ref) => {
+    const id = useId();
+    const errorId = error ? `${props.id || id}-error` : undefined;
+    const describedBy = [props["aria-describedby"], errorId].filter(Boolean).join(" ") || undefined;
+    const ariaInvalid = error ? true : props["aria-invalid"];
+    const [innerChecked, setInnerChecked] = useState(props.checked ?? false);
+    const checked = innerChecked;
+    const innerRef = useRef(null);
+    const stableOnChange = useStableRef(props.onChange);
+    useImperativeHandle(ref, () => innerRef.current);
+    useEffect(() => {
+        if (innerRef.current !== null) {
+            if (stableOnChange.current) {
+                const onChange = (e) => {
+                    if (stableOnChange.current)
+                        stableOnChange.current(e);
+                };
+                const ref = innerRef.current;
+                ref.addEventListener("change", onChange);
+                return () => ref?.removeEventListener("change", onChange);
+            }
+        }
+    }, [stableOnChange]);
+    const onCheck = () => {
+        const checked = !innerRef.current?.checked;
+        setInnerChecked(checked);
+        onCheckProp?.(checked);
+        if (innerRef.current !== null) {
+            innerRef.current.checked = checked;
+            innerRef.current.dispatchEvent(new Event("change", { bubbles: true }));
+        }
+    };
+    return (<fieldset className={css("flex flex-col flex-wrap justify-center", container)} data-component="switch" disabled={props.disabled || loading}>
+                <span className="flex flex-row flex-wrap items-center">
+                    <input {...props} hidden ref={innerRef} type="checkbox" checked={checked} id={props.id || id} data-trigger="change" data-checked={checked} disabled={props.disabled || loading} onChange={(e) => setInnerChecked(e.target.checked)}/>
+                    <button role="switch" type="button" onClick={onCheck} onKeyDown={(event) => {
+            onKeyDown?.(event);
+            if (event.defaultPrevented)
+                return;
+            if (event.key === " " || event.key === "Space" || event.code === "Space" || event.key === "Enter") {
+                event.preventDefault();
+                onCheck();
+            }
+        }} aria-checked={checked} aria-invalid={ariaInvalid} aria-describedby={describedBy} data-checked={checked} aria-labelledby={`${id}-label`} disabled={props.disabled || loading} className="relative inline-flex h-switch-track-h w-switch-track-w flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-300 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary">
+                        <span aria-hidden="true" data-checked={checked} className="inline-block aspect-square size-switch-thumb-size transform rounded-full shadow ring-0 transition duration-300 ease-in-out data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch"/>
+                    </button>
+                    <label htmlFor={props.id || id} className="ml-switch-gap inline-block text-switch-label-text" id={`${id}-label`}>
+                        <span className="font-medium text-foreground">{children}</span>
+                    </label>
+                </span>
+                <span id={errorId} className="mt-switch-hint-mt flex-1 whitespace-nowrap text-switch-hint-text text-danger empty:mt-0 empty:hidden">
+                    {error}
+                </span>
+            </fieldset>);
+});

package/dist/components/form/task-list.d.ts

@@ -0,0 +1,3 @@
+import { ComponentProps, PropsWithChildren } from "react";
+export declare const TaskList: (props: PropsWithChildren<ComponentProps<"fieldset">>) => import("react").JSX.Element;
+//# sourceMappingURL=task-list.d.ts.map

package/dist/components/form/task-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-list.d.ts","sourceRoot":"","sources":["../../../src/components/form/task-list.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAErE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,gCA2B5E,CAAC"}

package/dist/components/form/task-list.jsx

@@ -0,0 +1,26 @@
+"use client";
+import { stagger, useAnimate } from "motion/react";
+import { useEffect } from "react";
+export const TaskList = (props) => {
+    const [ref, animate] = useAnimate();
+    useEffect(() => {
+        const container = ref.current;
+        if (!container)
+            return;
+        const handler = (e) => {
+            const input = e.target;
+            const items = Array.from(container.querySelectorAll("input[data-task=true]"));
+            const allTaskChecked = items.every((el) => el.checked);
+            const index = items.indexOf(input);
+            if (allTaskChecked && index !== -1) {
+                animate("input", { scale: [1, 1.35, 1], rotate: [0, 20, -20, 0] }, {
+                    duration: 0.5,
+                    delay: stagger(0.075, { from: index }),
+                });
+            }
+        };
+        container.addEventListener("change", handler);
+        return () => container.removeEventListener("change", handler);
+    }, [ref, animate]);
+    return <fieldset {...props} data-component="task-list" ref={ref}/>;
+};

package/dist/components/form/textarea.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { FreeTextProps } from "./free-text";
+export type TextareaProps = FreeTextProps<"textarea", React.ComponentProps<"textarea">>;
+export declare const Textarea: React.FC<TextareaProps>;
+//# sourceMappingURL=textarea.d.ts.map

package/dist/components/form/textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/components/form/textarea.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;AAExF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA6B5C,CAAC"}

package/dist/components/form/textarea.js

@@ -0,0 +1,19 @@
+"use client";
+import { createFreeText as e } from "./free-text.js";
+//#region src/components/form/textarea.tsx
+var t = e("textarea", "textarea", { container: "w-full" }, (e) => {
+	let t = e.hasAttribute("rows"), n = (() => {
+		if (!t) return e.offsetHeight;
+		let n = window.getComputedStyle(e);
+		return e.rows * parseFloat(n.lineHeight) + parseFloat(n.paddingTop) + parseFloat(n.paddingBottom) + parseFloat(n.borderTopWidth) + parseFloat(n.borderBottomWidth);
+	})(), r = () => {
+		e.style.height = "0px", e.style.height = `${Math.max(e.scrollHeight, n)}px`;
+	};
+	return r(), e.addEventListener("input", r), () => {
+		e.removeEventListener("input", r), e.style.height = "";
+	};
+});
+//#endregion
+export { t as Textarea };
+
+//# sourceMappingURL=textarea.js.map

package/dist/components/form/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.js","names":[],"sources":["../../../src/components/form/textarea.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport { Any } from \"../../types\";\nimport { createFreeText, FreeTextProps } from \"./free-text\";\n\nexport type TextareaProps = FreeTextProps<\"textarea\", React.ComponentProps<\"textarea\">>;\n\nexport const Textarea: React.FC<TextareaProps> = createFreeText<\"textarea\", HTMLTextAreaElement, Any>(\n    \"textarea\",\n    \"textarea\",\n    { container: \"w-full\" },\n    (textarea: HTMLTextAreaElement) => {\n        const hasRows = textarea.hasAttribute(\"rows\");\n        const computeMinHeight = (): number => {\n            if (!hasRows) return textarea.offsetHeight;\n            const s = window.getComputedStyle(textarea);\n            return (\n                textarea.rows * parseFloat(s.lineHeight) +\n                parseFloat(s.paddingTop) +\n                parseFloat(s.paddingBottom) +\n                parseFloat(s.borderTopWidth) +\n                parseFloat(s.borderBottomWidth)\n            );\n        };\n        const minHeight = computeMinHeight();\n        const adjustHeight = () => {\n            textarea.style.height = \"0px\";\n            textarea.style.height = `${Math.max(textarea.scrollHeight, minHeight)}px`;\n        };\n        adjustHeight();\n        textarea.addEventListener(\"input\", adjustHeight);\n        return () => {\n            textarea.removeEventListener(\"input\", adjustHeight);\n            textarea.style.height = \"\";\n        };\n    }\n);\n"],"mappings":";;;AAOA,IAAa,IAAoC,EAC7C,YACA,YACA,EAAE,WAAW,SAAS,IACrB,MAAkC;CAC/B,IAAM,IAAU,EAAS,aAAa,MAAM,GAYtC,WAXiC;EACnC,IAAI,CAAC,GAAS,OAAO,EAAS;EAC9B,IAAM,IAAI,OAAO,iBAAiB,CAAQ;EAC1C,OACI,EAAS,OAAO,WAAW,EAAE,UAAU,IACvC,WAAW,EAAE,UAAU,IACvB,WAAW,EAAE,aAAa,IAC1B,WAAW,EAAE,cAAc,IAC3B,WAAW,EAAE,iBAAiB;CAEtC,GACmC,GAC7B,UAAqB;EAEvB,AADA,EAAS,MAAM,SAAS,OACxB,EAAS,MAAM,SAAS,GAAG,KAAK,IAAI,EAAS,cAAc,CAAS,EAAE;CAC1E;CAGA,OAFA,EAAa,GACb,EAAS,iBAAiB,SAAS,CAAY,SAClC;EAET,AADA,EAAS,oBAAoB,SAAS,CAAY,GAClD,EAAS,MAAM,SAAS;CAC5B;AACJ,CACJ"}

package/dist/components/form/textarea.jsx

@@ -0,0 +1,26 @@
+"use client";
+import { createFreeText } from "./free-text";
+export const Textarea = createFreeText("textarea", "textarea", { container: "w-full" }, (textarea) => {
+    const hasRows = textarea.hasAttribute("rows");
+    const computeMinHeight = () => {
+        if (!hasRows)
+            return textarea.offsetHeight;
+        const s = window.getComputedStyle(textarea);
+        return (textarea.rows * parseFloat(s.lineHeight) +
+            parseFloat(s.paddingTop) +
+            parseFloat(s.paddingBottom) +
+            parseFloat(s.borderTopWidth) +
+            parseFloat(s.borderBottomWidth));
+    };
+    const minHeight = computeMinHeight();
+    const adjustHeight = () => {
+        textarea.style.height = "0px";
+        textarea.style.height = `${Math.max(textarea.scrollHeight, minHeight)}px`;
+    };
+    adjustHeight();
+    textarea.addEventListener("input", adjustHeight);
+    return () => {
+        textarea.removeEventListener("input", adjustHeight);
+        textarea.style.height = "";
+    };
+});

package/dist/components/index.d.ts

@@ -0,0 +1,45 @@
+export * from "./core/tag";
+export * from "./form/form";
+export * from "./form/input";
+export * from "./core/button";
+export * from "./form/select";
+export * from "./form/slider";
+export * from "./form/switch";
+export * from "./table/index";
+export * from "./display/card";
+export * from "./display/list";
+export * from "./display/step";
+export * from "./display/tabs";
+export * from "./display/alert";
+export * from "./display/empty";
+export * from "./display/stats";
+export * from "./floating/menu";
+export * from "./form/checkbox";
+export * from "./form/radiobox";
+export * from "./form/textarea";
+export * from "./core/polymorph";
+export * from "./floating/modal";
+export * from "./form/task-list";
+export * from "./core/typography";
+export * from "./display/spinner";
+export * from "./floating/expand";
+export * from "./floating/wizard";
+export * from "./display/calendar";
+export * from "./display/progress";
+export * from "./display/timeline";
+export * from "./floating/toolbar";
+export * from "./floating/tooltip";
+export * from "./form/date-picker";
+export * from "./form/file-upload";
+export * from "./form/input-field";
+export * from "./floating/dropdown";
+export * from "./form/autocomplete";
+export * from "./form/multi-select";
+export * from "./core/render-on-view";
+export * from "./display/notifications";
+export * from "./floating/command-palette";
+export { CommandPalette as Commander } from "./floating/command-palette";
+export * from "./page-calendar";
+export { formReset } from "./form/formReset";
+export { createColumns, createOptionCols, type ColType, useTablePreferences, type TablePagination } from "./table/table-lib";
+//# sourceMappingURL=index.d.ts.map

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

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

package/dist/components/index.js

@@ -0,0 +1,44 @@
+export * from "./core/tag";
+export * from "./form/form";
+export * from "./form/input";
+export * from "./core/button";
+export * from "./form/select";
+export * from "./form/slider";
+export * from "./form/switch";
+export * from "./table/index";
+export * from "./display/card";
+export * from "./display/list";
+export * from "./display/step";
+export * from "./display/tabs";
+export * from "./display/alert";
+export * from "./display/empty";
+export * from "./display/stats";
+export * from "./floating/menu";
+export * from "./form/checkbox";
+export * from "./form/radiobox";
+export * from "./form/textarea";
+export * from "./core/polymorph";
+export * from "./floating/modal";
+export * from "./form/task-list";
+export * from "./core/typography";
+export * from "./display/spinner";
+export * from "./floating/expand";
+export * from "./floating/wizard";
+export * from "./display/calendar";
+export * from "./display/progress";
+export * from "./display/timeline";
+export * from "./floating/toolbar";
+export * from "./floating/tooltip";
+export * from "./form/date-picker";
+export * from "./form/file-upload";
+export * from "./form/input-field";
+export * from "./floating/dropdown";
+export * from "./form/autocomplete";
+export * from "./form/multi-select";
+export * from "./core/render-on-view";
+export * from "./display/notifications";
+export * from "./floating/command-palette";
+export { CommandPalette as Commander } from "./floating/command-palette";
+export * from "./page-calendar";
+export { formReset } from "./form/formReset";
+export { createColumns, createOptionCols, useTablePreferences } from "./table/table-lib";

package/dist/components/page-calendar/calendar-header.d.ts

@@ -0,0 +1,16 @@
+import type { CalendarFilter, ViewMode } from "./page-calendar.types";
+import type { SetState } from "../../types";
+import { type ReactNode } from "react";
+type CalendarHeaderProps = {
+    currentDate: Date;
+    currentView: ViewMode;
+    onAddEvent?: () => void;
+    filters: CalendarFilter[];
+    filterArea?: ReactNode;
+    setCurrentDate: SetState<Date>;
+    setCurrentView: SetState<ViewMode>;
+    onToggleFilter: (id: string) => void;
+};
+export declare function CalendarHeader({ currentDate, currentView, filters, filterArea, setCurrentDate, setCurrentView, onToggleFilter, onAddEvent, }: CalendarHeaderProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=calendar-header.d.ts.map

package/dist/components/page-calendar/calendar-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-header.d.ts","sourceRoot":"","sources":["../../../src/components/page-calendar/calendar-header.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAW,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhD,KAAK,mBAAmB,GAAG;IACvB,WAAW,EAAE,IAAI,CAAC;IAClB,WAAW,EAAE,QAAQ,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,cAAc,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC/B,cAAc,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACnC,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC3B,WAAW,EACX,WAAW,EACX,OAAO,EACP,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,UAAU,GACb,EAAE,mBAAmB,+BA0HrB"}

package/dist/components/page-calendar/calendar-header.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../calendar-header-Dfr-CwkY.js";
+export { e as CalendarHeader };

package/dist/components/page-calendar/calendar-header.jsx

@@ -0,0 +1,85 @@
+import { Button } from "../core/button";
+import { Tag } from "../core/tag";
+import { useLocale } from "../../hooks/use-locale";
+import { useTranslations } from "../../hooks/use-translations";
+import { CaretLeftIcon, CaretRightIcon, PlusCircleIcon, CalendarIcon } from "@phosphor-icons/react";
+import { addDays, addMonths, addWeeks, isToday, subDays, subMonths, subWeeks } from "date-fns";
+import { formatDay, formatMonthShort, formatMonthYear, getWeekNumber } from "./page-calendar.utils";
+import { useMemo } from "react";
+export function CalendarHeader({ currentDate, currentView, filters, filterArea, setCurrentDate, setCurrentView, onToggleFilter, onAddEvent, }) {
+    const locale = useLocale();
+    const t = useTranslations();
+    const isDateToday = isToday(currentDate);
+    const VIEWS = useMemo(() => [
+        { value: "month", label: t.pageCalendarMonthView },
+        { value: "week", label: t.pageCalendarWeekView },
+        { value: "day", label: t.pageCalendarDayView },
+    ], [t]);
+    const handlePrev = () => {
+        setCurrentDate((currentDate) => {
+            if (currentView === "month")
+                return subMonths(currentDate, 1);
+            if (currentView === "week")
+                return subWeeks(currentDate, 1);
+            return subDays(currentDate, 1);
+        });
+    };
+    const handleNext = () => {
+        setCurrentDate((currentDate) => {
+            if (currentView === "month")
+                return addMonths(currentDate, 1);
+            if (currentView === "week")
+                return addWeeks(currentDate, 1);
+            return addDays(currentDate, 1);
+        });
+    };
+    const weekNum = getWeekNumber(currentDate);
+    return (<header className="flex flex-col gap-page-calendar-header-gap">
+            <div className="flex items-center justify-between gap-page-calendar-header-gap">
+                <div className="flex items-center gap-page-calendar-date-gap">
+                    <div aria-hidden="true" className={`flex size-page-calendar-badge-size flex-col items-center justify-center overflow-hidden rounded-page-calendar-badge-radius text-page-calendar-week-label-text ${isDateToday ? "bg-primary text-primary-foreground" : "bg-card text-foreground"}`}>
+                        <span className="font-light uppercase leading-none">{formatMonthShort(currentDate, locale)}</span>
+                        <span className="text-page-calendar-title-text font-medium leading-none">{formatDay(currentDate, locale)}</span>
+                    </div>
+                    <div>
+                        <h1 aria-live="polite" aria-atomic="true" className="text-page-calendar-title-text font-bold leading-tight">
+                            {formatMonthYear(currentDate, locale)}
+                        </h1>
+                        <span className="text-page-calendar-week-label-text text-muted-foreground">{t.pageCalendarWeekLabel(weekNum)}</span>
+                    </div>
+                </div>
+                <nav aria-label={t.pageCalendarNavigation} className="flex items-center gap-page-calendar-nav-gap">
+                    <div className="flex items-center gap-page-calendar-nav-btn-gap">
+                        <Button size="small" title={t.pageCalendarPrevious} aria-label={t.pageCalendarPrevious} theme="ghost-muted" onClick={handlePrev}>
+                            <CaretLeftIcon size={16}/>
+                        </Button>
+                        <button type="button" aria-label={t.pageCalendarToday} onClick={() => setCurrentDate(new Date())} className="rounded-page-calendar-today-radius px-page-calendar-today-px py-page-calendar-today-py text-page-calendar-today-text transition-colors hover:bg-muted/50">
+                            {t.pageCalendarToday}
+                        </button>
+                        <Button size="small" title={t.pageCalendarNext} aria-label={t.pageCalendarNext} theme="ghost-muted" onClick={handleNext}>
+                            <CaretRightIcon size={16}/>
+                        </Button>
+                    </div>
+                    <div className="flex rounded-page-calendar-view-switch-radius">
+                        {VIEWS.map((v) => (<Button size="small" key={v.value} rounded="squared" onClick={() => setCurrentView(v.value)} theme={currentView === v.value ? "primary" : "muted"} aria-pressed={currentView === v.value} className="first:rounded-l-button-radius last:rounded-r-button-radius">
+                                {v.label}
+                            </Button>))}
+                    </div>
+                    {onAddEvent && (<Button theme="primary" size="small" onClick={onAddEvent}>
+                            <PlusCircleIcon size={14}/>
+                            {t.pageCalendarAddEvent}
+                        </Button>)}
+                </nav>
+            </div>
+            {filterArea ??
+            (filters.length > 0 && (<div role="group" aria-label={t.pageCalendarFilter} className="flex flex-wrap items-center gap-page-calendar-filter-gap">
+                        <span className="text-muted-foreground">
+                            <CalendarIcon size={14} aria-hidden="true"/>
+                        </span>
+                        <span className="mr-page-calendar-nav-mr text-page-calendar-filter-text text-muted-foreground">{t.pageCalendarFilter}</span>
+                        {filters.map((filter) => (<Tag as="button" size="small" type="button" key={filter.id} theme={filter.theme} indicator={filter.enabled ? filter.theme : undefined} aria-pressed={filter.enabled} aria-label={`${filter.label}, ${filter.enabled ? t.pageCalendarFilterEnabled : t.pageCalendarFilterDisabled}`} onClick={() => onToggleFilter(filter.id)}>
+                                {filter.label}
+                            </Tag>))}
+                    </div>))}
+        </header>);
+}

package/dist/components/page-calendar/day-view.d.ts

@@ -0,0 +1,12 @@
+import type { CalendarEvent, CalendarEventBase } from "./page-calendar.types";
+type DayViewProps<T extends CalendarEventBase> = {
+    currentDate: Date;
+    onDateChange: (date: Date) => void;
+    onSlotClick?: (date: Date) => void;
+    eventsByDate: Map<string, CalendarEvent<T>[]>;
+    onEventClick: (event: CalendarEvent<T>) => void;
+    renderEvent?: (event: CalendarEvent<T>) => React.ReactNode;
+};
+export declare function DayView<T extends CalendarEventBase>({ currentDate, onSlotClick, renderEvent, eventsByDate, onDateChange, onEventClick, }: DayViewProps<T>): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=day-view.d.ts.map

package/dist/components/page-calendar/day-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"day-view.d.ts","sourceRoot":"","sources":["../../../src/components/page-calendar/day-view.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAuB9E,KAAK,YAAY,CAAC,CAAC,SAAS,iBAAiB,IAAI;IAC7C,WAAW,EAAE,IAAI,CAAC;IAClB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC9C,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAChD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D,CAAC;AAEF,wBAAgB,OAAO,CAAC,CAAC,SAAS,iBAAiB,EAAE,EACjD,WAAW,EACX,WAAW,EACX,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,YAAY,GACf,EAAE,YAAY,CAAC,CAAC,CAAC,+BA4HjB"}