@florianke/components 0.0.1 → 0.0.3

package/dist/hint.d.mts

@@ -0,0 +1,17 @@
+import * as React from "react";
+
+//#region src/components/hint/hint.d.ts
+type HintVariant = "info" | "error";
+type HintProps = React.ComponentPropsWithoutRef<"span"> & {
+  variant?: HintVariant;
+  ref?: React.Ref<HTMLElement>;
+};
+declare function Hint({
+  className,
+  variant,
+  ref,
+  ...props
+}: HintProps): React.JSX.Element;
+//#endregion
+export { Hint };
+//# sourceMappingURL=hint.d.mts.map

package/dist/hint.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hint.d.mts","names":[],"sources":["../src/components/hint/hint.tsx"],"mappings":";;;KAIK,WAAA;AAAA,KAOA,SAAA,GAAY,KAAA,CAAM,wBAAA;EACrB,OAAA,GAAU,WAAA;EACV,GAAA,GAAM,KAAA,CAAM,GAAA,CAAI,WAAA;AAAA;AAAA,iBAGF,IAAA,CAAA;EAAO,SAAA;EAAW,OAAA;EAAkB,GAAA;EAAA,GAAQ;AAAA,GAAS,SAAA,GAAS,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/hint.mjs

@@ -0,0 +1,22 @@
+import { t as cn } from "./cn-BpvCVwZv.mjs";
+import { Text } from "./text.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/hint/hint.tsx
+const variants = {
+	info: "text-(--muted-foreground)",
+	error: "text-(--destructive)"
+};
+function Hint({ className, variant = "info", ref, ...props }) {
+	return /* @__PURE__ */ jsx(Text, {
+		as: "span",
+		size: "small",
+		ref,
+		className: cn(variants[variant], className),
+		...props
+	});
+}
+//#endregion
+export { Hint };
+
+//# sourceMappingURL=hint.mjs.map

package/dist/hint.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hint.mjs","names":[],"sources":["../src/components/hint/hint.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/lib/cn\";\nimport { Text } from \"../text/text\";\n\ntype HintVariant = \"info\" | \"error\";\n\nconst variants: Record<HintVariant, string> = {\n  info: \"text-(--muted-foreground)\",\n  error: \"text-(--destructive)\",\n};\n\ntype HintProps = React.ComponentPropsWithoutRef<\"span\"> & {\n  variant?: HintVariant;\n  ref?: React.Ref<HTMLElement>;\n};\n\nexport function Hint({ className, variant = \"info\", ref, ...props }: HintProps) {\n  return (\n    <Text\n      as=\"span\"\n      size=\"small\"\n      ref={ref}\n      className={cn(variants[variant], className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;AAMA,MAAM,WAAwC;CAC5C,MAAM;CACN,OAAO;CACR;AAOD,SAAgB,KAAK,EAAE,WAAW,UAAU,QAAQ,KAAK,GAAG,SAAoB;AAC9E,QACE,oBAAC,MAAD;EACE,IAAG;EACH,MAAK;EACA;EACL,WAAW,GAAG,SAAS,UAAU,UAAU;EAC3C,GAAI;EACJ,CAAA"}

package/dist/hooks/use-confirm.d.mts

@@ -0,0 +1,23 @@
+import * as React from "react";
+
+//#region src/hooks/use-confirm.d.ts
+type ConfirmVariant = "default" | "danger";
+type ConfirmOptions = {
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  confirmText?: string;
+  cancelText?: string;
+  variant?: ConfirmVariant;
+  verificationText?: string;
+  verificationInstruction?: React.ReactNode;
+};
+type ConfirmFn = (options?: ConfirmOptions) => Promise<boolean>;
+declare function ConfirmProvider({
+  children
+}: {
+  children?: React.ReactNode;
+}): React.JSX.Element;
+declare function useConfirm(): ConfirmFn;
+//#endregion
+export { ConfirmProvider, useConfirm };
+//# sourceMappingURL=use-confirm.d.mts.map

package/dist/hooks/use-confirm.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-confirm.d.mts","names":[],"sources":["../../src/hooks/use-confirm.tsx"],"mappings":";;;KAQK,cAAA;AAAA,KAEA,cAAA;EACH,KAAA,GAAQ,KAAA,CAAM,SAAA;EACd,WAAA,GAAc,KAAA,CAAM,SAAA;EACpB,WAAA;EACA,UAAA;EACA,OAAA,GAAU,cAAA;EACV,gBAAA;EACA,uBAAA,GAA0B,KAAA,CAAM,SAAA;AAAA;AAAA,KAQ7B,SAAA,IAAa,OAAA,GAAU,cAAA,KAAmB,OAAA;AAAA,iBAI/B,eAAA,CAAA;EAAkB;AAAA;EAAc,QAAA,GAAW,KAAA,CAAM,SAAA;AAAA,IAAW,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAiG5D,UAAA,CAAA,GAAc,SAAA"}

package/dist/hooks/use-confirm.mjs

@@ -0,0 +1,97 @@
+"use client";
+import { Button } from "../button.mjs";
+import { AlertDialog } from "../alert-dialog.mjs";
+import { Input } from "../input.mjs";
+import { Label } from "../label.mjs";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/hooks/use-confirm.tsx
+const ConfirmContext = React.createContext(null);
+function ConfirmProvider({ children }) {
+	const [request, setRequest] = React.useState(null);
+	const [verification, setVerification] = React.useState("");
+	const resolvedRef = React.useRef(false);
+	const confirm = React.useCallback((options = {}) => {
+		return new Promise((resolve) => {
+			setVerification("");
+			setRequest({
+				options,
+				resolve
+			});
+		});
+	}, []);
+	function close(value) {
+		request?.resolve(value);
+		resolvedRef.current = true;
+		setRequest(null);
+		setVerification("");
+	}
+	function handleOpenChange(open) {
+		if (open) return;
+		if (!resolvedRef.current) request?.resolve(false);
+		resolvedRef.current = false;
+		setRequest(null);
+		setVerification("");
+	}
+	const verificationText = request?.options.verificationText;
+	const requiresVerification = !!verificationText;
+	const canConfirm = !requiresVerification || verification === verificationText;
+	return /* @__PURE__ */ jsxs(ConfirmContext.Provider, {
+		value: confirm,
+		children: [children, /* @__PURE__ */ jsx(AlertDialog, {
+			open: request !== null,
+			onOpenChange: handleOpenChange,
+			children: /* @__PURE__ */ jsxs(AlertDialog.Content, { children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col gap-1",
+					children: [/* @__PURE__ */ jsx(AlertDialog.Title, { children: request?.options.title ?? "Are you sure?" }), request?.options.description && /* @__PURE__ */ jsx(AlertDialog.Description, { children: request.options.description })]
+				}),
+				requiresVerification && /* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col gap-1.5",
+					children: [/* @__PURE__ */ jsx(Label, {
+						size: "small",
+						htmlFor: "confirm-verification-text",
+						children: request?.options.verificationInstruction ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+							"Type ",
+							/* @__PURE__ */ jsx("span", {
+								className: "font-semibold",
+								children: verificationText
+							}),
+							" ",
+							"to confirm."
+						] })
+					}), /* @__PURE__ */ jsx(Input, {
+						id: "confirm-verification-text",
+						autoFocus: true,
+						value: verification,
+						onValueChange: (value) => setVerification(value),
+						onKeyDown: (event) => {
+							if (event.key === "Enter" && verification === verificationText) close(true);
+						}
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex justify-end gap-2",
+					children: [/* @__PURE__ */ jsx(AlertDialog.Close, {
+						onClick: () => close(false),
+						children: request?.options.cancelText ?? "Cancel"
+					}), /* @__PURE__ */ jsx(AlertDialog.Close, {
+						render: /* @__PURE__ */ jsx(Button, { variant: request?.options.variant === "danger" ? "destructive" : "primary" }),
+						disabled: !canConfirm,
+						onClick: () => close(true),
+						children: request?.options.confirmText ?? "Confirm"
+					})]
+				})
+			] })
+		})]
+	});
+}
+function useConfirm() {
+	const confirm = React.useContext(ConfirmContext);
+	if (!confirm) throw new Error("useConfirm must be used within a ConfirmProvider");
+	return confirm;
+}
+//#endregion
+export { ConfirmProvider, useConfirm };
+
+//# sourceMappingURL=use-confirm.mjs.map

package/dist/hooks/use-confirm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-confirm.mjs","names":[],"sources":["../../src/hooks/use-confirm.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AlertDialog } from \"../components/alert-dialog/alert-dialog\";\nimport { Button } from \"../components/button/button\";\nimport { Input } from \"../components/input/input\";\nimport { Label } from \"../components/label/label\";\n\ntype ConfirmVariant = \"default\" | \"danger\";\n\ntype ConfirmOptions = {\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  confirmText?: string;\n  cancelText?: string;\n  variant?: ConfirmVariant;\n  verificationText?: string;\n  verificationInstruction?: React.ReactNode;\n};\n\ntype ConfirmRequest = {\n  options: ConfirmOptions;\n  resolve: (value: boolean) => void;\n};\n\ntype ConfirmFn = (options?: ConfirmOptions) => Promise<boolean>;\n\nconst ConfirmContext = React.createContext<ConfirmFn | null>(null);\n\nexport function ConfirmProvider({ children }: { children?: React.ReactNode }) {\n  const [request, setRequest] = React.useState<ConfirmRequest | null>(null);\n  const [verification, setVerification] = React.useState(\"\");\n  const resolvedRef = React.useRef(false);\n\n  const confirm = React.useCallback<ConfirmFn>((options = {}) => {\n    return new Promise<boolean>((resolve) => {\n      setVerification(\"\");\n      setRequest({ options, resolve });\n    });\n  }, []);\n\n  function close(value: boolean) {\n    request?.resolve(value);\n    resolvedRef.current = true;\n    setRequest(null);\n    setVerification(\"\");\n  }\n\n  function handleOpenChange(open: boolean) {\n    if (open) return;\n    if (!resolvedRef.current) {\n      request?.resolve(false);\n    }\n    resolvedRef.current = false;\n    setRequest(null);\n    setVerification(\"\");\n  }\n\n  const verificationText = request?.options.verificationText;\n  const requiresVerification = !!verificationText;\n  const canConfirm = !requiresVerification || verification === verificationText;\n\n  return (\n    <ConfirmContext.Provider value={confirm}>\n      {children}\n      <AlertDialog open={request !== null} onOpenChange={handleOpenChange}>\n        <AlertDialog.Content>\n          <div className=\"flex flex-col gap-1\">\n            <AlertDialog.Title>\n              {request?.options.title ?? \"Are you sure?\"}\n            </AlertDialog.Title>\n            {request?.options.description && (\n              <AlertDialog.Description>\n                {request.options.description}\n              </AlertDialog.Description>\n            )}\n          </div>\n          {requiresVerification && (\n            <div className=\"flex flex-col gap-1.5\">\n              <Label size=\"small\" htmlFor=\"confirm-verification-text\">\n                {request?.options.verificationInstruction ?? (\n                  <>\n                    Type <span className=\"font-semibold\">{verificationText}</span>{\" \"}\n                    to confirm.\n                  </>\n                )}\n              </Label>\n              <Input\n                id=\"confirm-verification-text\"\n                autoFocus\n                value={verification}\n                onValueChange={(value) => setVerification(value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" && verification === verificationText) {\n                    close(true);\n                  }\n                }}\n              />\n            </div>\n          )}\n          <div className=\"flex justify-end gap-2\">\n            <AlertDialog.Close onClick={() => close(false)}>\n              {request?.options.cancelText ?? \"Cancel\"}\n            </AlertDialog.Close>\n            <AlertDialog.Close\n              render={\n                <Button\n                  variant={\n                    request?.options.variant === \"danger\"\n                      ? \"destructive\"\n                      : \"primary\"\n                  }\n                />\n              }\n              disabled={!canConfirm}\n              onClick={() => close(true)}\n            >\n              {request?.options.confirmText ?? \"Confirm\"}\n            </AlertDialog.Close>\n          </div>\n        </AlertDialog.Content>\n      </AlertDialog>\n    </ConfirmContext.Provider>\n  );\n}\n\nexport function useConfirm(): ConfirmFn {\n  const confirm = React.useContext(ConfirmContext);\n  if (!confirm) {\n    throw new Error(\"useConfirm must be used within a ConfirmProvider\");\n  }\n  return confirm;\n}\n"],"mappings":";;;;;;;;AA2BA,MAAM,iBAAiB,MAAM,cAAgC,KAAK;AAElE,SAAgB,gBAAgB,EAAE,YAA4C;CAC5E,MAAM,CAAC,SAAS,cAAc,MAAM,SAAgC,KAAK;CACzE,MAAM,CAAC,cAAc,mBAAmB,MAAM,SAAS,GAAG;CAC1D,MAAM,cAAc,MAAM,OAAO,MAAM;CAEvC,MAAM,UAAU,MAAM,aAAwB,UAAU,EAAE,KAAK;AAC7D,SAAO,IAAI,SAAkB,YAAY;AACvC,mBAAgB,GAAG;AACnB,cAAW;IAAE;IAAS;IAAS,CAAC;IAChC;IACD,EAAE,CAAC;CAEN,SAAS,MAAM,OAAgB;AAC7B,WAAS,QAAQ,MAAM;AACvB,cAAY,UAAU;AACtB,aAAW,KAAK;AAChB,kBAAgB,GAAG;;CAGrB,SAAS,iBAAiB,MAAe;AACvC,MAAI,KAAM;AACV,MAAI,CAAC,YAAY,QACf,UAAS,QAAQ,MAAM;AAEzB,cAAY,UAAU;AACtB,aAAW,KAAK;AAChB,kBAAgB,GAAG;;CAGrB,MAAM,mBAAmB,SAAS,QAAQ;CAC1C,MAAM,uBAAuB,CAAC,CAAC;CAC/B,MAAM,aAAa,CAAC,wBAAwB,iBAAiB;AAE7D,QACE,qBAAC,eAAe,UAAhB;EAAyB,OAAO;YAAhC,CACG,UACD,oBAAC,aAAD;GAAa,MAAM,YAAY;GAAM,cAAc;aACjD,qBAAC,YAAY,SAAb,EAAA,UAAA;IACE,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,YAAY,OAAb,EAAA,UACG,SAAS,QAAQ,SAAS,iBACT,CAAA,EACnB,SAAS,QAAQ,eAChB,oBAAC,YAAY,aAAb,EAAA,UACG,QAAQ,QAAQ,aACO,CAAA,CAExB;;IACL,wBACC,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,OAAD;MAAO,MAAK;MAAQ,SAAQ;gBACzB,SAAS,QAAQ,2BAChB,qBAAA,UAAA,EAAA,UAAA;OAAE;OACK,oBAAC,QAAD;QAAM,WAAU;kBAAiB;QAAwB,CAAA;OAAC;OAAI;OAElE,EAAA,CAAA;MAEC,CAAA,EACR,oBAAC,OAAD;MACE,IAAG;MACH,WAAA;MACA,OAAO;MACP,gBAAgB,UAAU,gBAAgB,MAAM;MAChD,YAAY,UAAU;AACpB,WAAI,MAAM,QAAQ,WAAW,iBAAiB,iBAC5C,OAAM,KAAK;;MAGf,CAAA,CACE;;IAER,qBAAC,OAAD;KAAK,WAAU;eAAf,CACE,oBAAC,YAAY,OAAb;MAAmB,eAAe,MAAM,MAAM;gBAC3C,SAAS,QAAQ,cAAc;MACd,CAAA,EACpB,oBAAC,YAAY,OAAb;MACE,QACE,oBAAC,QAAD,EACE,SACE,SAAS,QAAQ,YAAY,WACzB,gBACA,WAEN,CAAA;MAEJ,UAAU,CAAC;MACX,eAAe,MAAM,KAAK;gBAEzB,SAAS,QAAQ,eAAe;MACf,CAAA,CAChB;;IACc,EAAA,CAAA;GACV,CAAA,CACU;;;AAI9B,SAAgB,aAAwB;CACtC,MAAM,UAAU,MAAM,WAAW,eAAe;AAChD,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,mDAAmD;AAErE,QAAO"}

package/dist/index.d.mts

@@ -1,8 +1,18 @@
+import { AlertDialog } from "./alert-dialog.mjs";
 import { Avatar } from "./avatar.mjs";
 import { Button } from "./button.mjs";
 import { Card } from "./card.mjs";
 import { DropdownMenu } from "./dropdown-menu.mjs";
+import { Field } from "./field.mjs";
+import { Heading } from "./heading.mjs";
+import { Hint } from "./hint.mjs";
 import { Input } from "./input.mjs";
+import { Label } from "./label.mjs";
+import { Providers } from "./providers.mjs";
 import { Select } from "./select.mjs";
+import { Text } from "./text.mjs";
+import { Toast } from "./toast.mjs";
+import { Tooltip } from "./tooltip.mjs";
+import { ConfirmProvider, useConfirm } from "./hooks/use-confirm.mjs";
 import { useInitials } from "./hooks/use-initials.mjs";
-export { Avatar, Button, Card, DropdownMenu, Input, Select, useInitials };
+export { AlertDialog, Avatar, Button, Card, ConfirmProvider, DropdownMenu, Field, Heading, Hint, Input, Label, Providers, Select, Text, Toast, Tooltip, useConfirm, useInitials };

package/dist/index.mjs

@@ -1,8 +1,18 @@
+import { Button } from "./button.mjs";
+import { Text } from "./text.mjs";
+import { AlertDialog } from "./alert-dialog.mjs";
 import { useInitials } from "./hooks/use-initials.mjs";
 import { Avatar } from "./avatar.mjs";
-import { Button } from "./button.mjs";
 import { Card } from "./card.mjs";
 import { DropdownMenu } from "./dropdown-menu.mjs";
+import { Field } from "./field.mjs";
+import { Heading } from "./heading.mjs";
+import { Hint } from "./hint.mjs";
 import { Input } from "./input.mjs";
+import { Label } from "./label.mjs";
+import { ConfirmProvider, useConfirm } from "./hooks/use-confirm.mjs";
+import { Toast } from "./toast.mjs";
+import { Tooltip } from "./tooltip.mjs";
+import { Providers } from "./providers.mjs";
 import { Select } from "./select.mjs";
-export { Avatar, Button, Card, DropdownMenu, Input, Select, useInitials };
+export { AlertDialog, Avatar, Button, Card, ConfirmProvider, DropdownMenu, Field, Heading, Hint, Input, Label, Providers, Select, Text, Toast, Tooltip, useConfirm, useInitials };

package/dist/input.d.mts

@@ -9,6 +9,7 @@ type InputProps = Omit<React.ComponentPropsWithoutRef<typeof Input$1>, "size"> &
 declare function Input({
   className,
   size,
+  type,
   ...props
 }: InputProps): React.JSX.Element;
 //#endregion

package/dist/input.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.mts","names":[],"sources":["../src/components/input/input.tsx"],"mappings":";;;;KAIK,SAAA;AAAA,KAEA,UAAA,GAAa,IAAA,CAChB,KAAA,CAAM,wBAAA,QAAgC,OAAA;EAGtC,IAAA,GAAO,SAAA;AAAA;AAAA,iBAQO,KAAA,CAAA;EAAQ,SAAA;EAAW,IAAA;EAAA,GAAgB;AAAA,GAAS,UAAA,GAAU,KAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"input.d.mts","names":[],"sources":["../src/components/input/input.tsx"],"mappings":";;;;KAMK,SAAA;AAAA,KAEA,UAAA,GAAa,IAAA,CAChB,KAAA,CAAM,wBAAA,QAAgC,OAAA;EAGtC,IAAA,GAAO,SAAA;AAAA;AAAA,iBAaO,KAAA,CAAA;EAAQ,SAAA;EAAW,IAAA;EAAa,IAAA;EAAA,GAAS;AAAA,GAAS,UAAA,GAAU,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/input.mjs

@@ -1,18 +1,85 @@
+"use client";
 import { t as cn } from "./cn-BpvCVwZv.mjs";
-import "react";
-import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Input as Input$1 } from "@base-ui/react/input";
 //#region src/components/input/input.tsx
 const sizes = {
-	sm: "h-7 rounded-md px-1.5 text-[12px]",
-	md: "h-8 rounded-md px-2 text-[14px]"
+	sm: "h-7 rounded-md text-[12px]",
+	md: "h-8 rounded-md text-[14px]"
 };
-function Input({ className, size = "md", ...props }) {
+const paddingX = {
+	sm: "px-1.5",
+	md: "px-2"
+};
+function Input({ className, size = "md", type, ...props }) {
+	if (type === "password") return /* @__PURE__ */ jsx(PasswordInput, {
+		className,
+		size,
+		...props
+	});
 	return /* @__PURE__ */ jsx(Input$1, {
-		className: cn("w-full min-w-0 border bg-(--input) text-(--foreground) outline-none", "placeholder:text-(--muted-foreground)", "selection:bg-(--ring)/30 selection:text-(--foreground)", "border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out", "hover:bg-(--foreground)/4", "focus-visible:border-(--ring) focus-visible:ring-[3px] focus-visible:ring-(--ring)/20", "disabled:pointer-events-none disabled:opacity-50", "any-pointer-coarse:text-base", sizes[size], className),
+		type,
+		className: cn("w-full min-w-0 border bg-(--input) text-(--foreground) outline-none", "placeholder:text-(--muted-foreground)", "selection:bg-(--ring)/30 selection:text-(--foreground)", "border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out", "hover:bg-(--foreground)/4", "focus-visible:border-(--ring) focus-visible:ring-[3px] focus-visible:ring-(--ring)/20", "aria-invalid:border-(--destructive) aria-invalid:ring-[3px] aria-invalid:ring-(--destructive)/20", "aria-invalid:focus-visible:border-(--destructive) aria-invalid:focus-visible:ring-(--destructive)/20", "disabled:pointer-events-none disabled:opacity-50", "any-pointer-coarse:text-base", sizes[size], paddingX[size], className),
 		...props
 	});
 }
+function PasswordInput({ className, size = "md", disabled, ...props }) {
+	const [visible, setVisible] = React.useState(false);
+	const ariaInvalid = props["aria-invalid"];
+	const invalid = ariaInvalid === true || ariaInvalid === "true";
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex w-full min-w-0 items-stretch border bg-(--input) text-(--foreground)", "border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out", "hover:bg-(--foreground)/4", "focus-within:border-(--ring) focus-within:ring-[3px] focus-within:ring-(--ring)/20", invalid && "border-(--destructive) ring-[3px] ring-(--destructive)/20", invalid && "focus-within:border-(--destructive) focus-within:ring-(--destructive)/20", disabled && "pointer-events-none opacity-50", sizes[size], className),
+		children: [/* @__PURE__ */ jsx(Input$1, {
+			type: visible ? "text" : "password",
+			disabled,
+			className: cn("min-w-0 flex-1 border-0 bg-transparent text-inherit outline-none", "placeholder:text-(--muted-foreground)", "selection:bg-(--ring)/30 selection:text-(--foreground)", "any-pointer-coarse:text-base", paddingX[size]),
+			...props
+		}), /* @__PURE__ */ jsx("button", {
+			type: "button",
+			onClick: () => setVisible((current) => !current),
+			disabled,
+			"aria-label": visible ? "Passwort verbergen" : "Passwort anzeigen",
+			"aria-pressed": visible,
+			className: cn("flex shrink-0 items-center justify-center border-l border-(--input-border) text-(--muted-foreground) outline-none transition-colors duration-150 ease-out", "hover:bg-(--foreground)/4 hover:text-(--foreground)", "focus-visible:bg-(--foreground)/4 focus-visible:text-(--foreground)", "disabled:pointer-events-none", paddingX[size]),
+			children: visible ? /* @__PURE__ */ jsx(EyeOffIcon, { className: "size-4" }) : /* @__PURE__ */ jsx(EyeIcon, { className: "size-4" })
+		})]
+	});
+}
+function EyeIcon(props) {
+	return /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [/* @__PURE__ */ jsx("path", { d: "M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z" }), /* @__PURE__ */ jsx("circle", {
+			cx: "12",
+			cy: "12",
+			r: "3"
+		})]
+	});
+}
+function EyeOffIcon(props) {
+	return /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			/* @__PURE__ */ jsx("path", { d: "M9.9 5.1A9.4 9.4 0 0 1 12 5c6.5 0 10 7 10 7a16.8 16.8 0 0 1-3.1 4.1M6.2 6.2C3.7 7.9 2 12 2 12s3.5 7 10 7a9.7 9.7 0 0 0 5-1.4" }),
+			/* @__PURE__ */ jsx("path", { d: "M14.1 14.1a3 3 0 1 1-4.2-4.2" }),
+			/* @__PURE__ */ jsx("path", { d: "M2 2l20 20" })
+		]
+	});
+}
 //#endregion
 export { Input };
 

package/dist/input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.mjs","names":["BaseInput"],"sources":["../src/components/input/input.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { cn } from \"@/lib/cn\";\n\ntype InputSize = \"sm\" | \"md\";\n\ntype InputProps = Omit<\n  React.ComponentPropsWithoutRef<typeof BaseInput>,\n  \"size\"\n> & {\n  size?: InputSize;\n};\n\nconst sizes: Record<InputSize, string> = {\n  sm: \"h-7 rounded-md px-1.5 text-[12px]\",\n  md: \"h-8 rounded-md px-2 text-[14px]\",\n};\n\nexport function Input({ className, size = \"md\", ...props }: InputProps) {\n  return (\n    <BaseInput\n      className={cn(\n        \"w-full min-w-0 border bg-(--input) text-(--foreground) outline-none\",\n        \"placeholder:text-(--muted-foreground)\",\n        \"selection:bg-(--ring)/30 selection:text-(--foreground)\",\n        \"border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out\",\n        \"hover:bg-(--foreground)/4\",\n        \"focus-visible:border-(--ring) focus-visible:ring-[3px] focus-visible:ring-(--ring)/20\",\n        \"disabled:pointer-events-none disabled:opacity-50\",\n        \"any-pointer-coarse:text-base\",\n        sizes[size],\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,MAAM,QAAmC;CACvC,IAAI;CACJ,IAAI;CACL;AAED,SAAgB,MAAM,EAAE,WAAW,OAAO,MAAM,GAAG,SAAqB;AACtE,QACE,oBAACA,SAAD;EACE,WAAW,GACT,uEACA,yCACA,0DACA,sFACA,6BACA,yFACA,oDACA,gCACA,MAAM,OACN,UACD;EACD,GAAI;EACJ,CAAA"}
+{"version":3,"file":"input.mjs","names":["BaseInput"],"sources":["../src/components/input/input.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Input as BaseInput } from \"@base-ui/react/input\";\nimport { cn } from \"@/lib/cn\";\n\ntype InputSize = \"sm\" | \"md\";\n\ntype InputProps = Omit<\n  React.ComponentPropsWithoutRef<typeof BaseInput>,\n  \"size\"\n> & {\n  size?: InputSize;\n};\n\nconst sizes: Record<InputSize, string> = {\n  sm: \"h-7 rounded-md text-[12px]\",\n  md: \"h-8 rounded-md text-[14px]\",\n};\n\nconst paddingX: Record<InputSize, string> = {\n  sm: \"px-1.5\",\n  md: \"px-2\",\n};\n\nexport function Input({ className, size = \"md\", type, ...props }: InputProps) {\n  if (type === \"password\") {\n    return <PasswordInput className={className} size={size} {...props} />;\n  }\n\n  return (\n    <BaseInput\n      type={type}\n      className={cn(\n        \"w-full min-w-0 border bg-(--input) text-(--foreground) outline-none\",\n        \"placeholder:text-(--muted-foreground)\",\n        \"selection:bg-(--ring)/30 selection:text-(--foreground)\",\n        \"border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out\",\n        \"hover:bg-(--foreground)/4\",\n        \"focus-visible:border-(--ring) focus-visible:ring-[3px] focus-visible:ring-(--ring)/20\",\n        \"aria-invalid:border-(--destructive) aria-invalid:ring-[3px] aria-invalid:ring-(--destructive)/20\",\n        \"aria-invalid:focus-visible:border-(--destructive) aria-invalid:focus-visible:ring-(--destructive)/20\",\n        \"disabled:pointer-events-none disabled:opacity-50\",\n        \"any-pointer-coarse:text-base\",\n        sizes[size],\n        paddingX[size],\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\ntype PasswordInputProps = Omit<InputProps, \"type\">;\n\nfunction PasswordInput({\n  className,\n  size = \"md\",\n  disabled,\n  ...props\n}: PasswordInputProps) {\n  const [visible, setVisible] = React.useState(false);\n  const ariaInvalid = props[\"aria-invalid\"];\n  const invalid = ariaInvalid === true || ariaInvalid === \"true\";\n\n  return (\n    <div\n      className={cn(\n        \"flex w-full min-w-0 items-stretch border bg-(--input) text-(--foreground)\",\n        \"border-(--input-border) transition-[border-color,box-shadow] duration-150 ease-out\",\n        \"hover:bg-(--foreground)/4\",\n        \"focus-within:border-(--ring) focus-within:ring-[3px] focus-within:ring-(--ring)/20\",\n        invalid && \"border-(--destructive) ring-[3px] ring-(--destructive)/20\",\n        invalid &&\n          \"focus-within:border-(--destructive) focus-within:ring-(--destructive)/20\",\n        disabled && \"pointer-events-none opacity-50\",\n        sizes[size],\n        className,\n      )}\n    >\n      <BaseInput\n        type={visible ? \"text\" : \"password\"}\n        disabled={disabled}\n        className={cn(\n          \"min-w-0 flex-1 border-0 bg-transparent text-inherit outline-none\",\n          \"placeholder:text-(--muted-foreground)\",\n          \"selection:bg-(--ring)/30 selection:text-(--foreground)\",\n          \"any-pointer-coarse:text-base\",\n          paddingX[size],\n        )}\n        {...props}\n      />\n      <button\n        type=\"button\"\n        onClick={() => setVisible((current) => !current)}\n        disabled={disabled}\n        aria-label={visible ? \"Passwort verbergen\" : \"Passwort anzeigen\"}\n        aria-pressed={visible}\n        className={cn(\n          \"flex shrink-0 items-center justify-center border-l border-(--input-border) text-(--muted-foreground) outline-none transition-colors duration-150 ease-out\",\n          \"hover:bg-(--foreground)/4 hover:text-(--foreground)\",\n          \"focus-visible:bg-(--foreground)/4 focus-visible:text-(--foreground)\",\n          \"disabled:pointer-events-none\",\n          paddingX[size],\n        )}\n      >\n        {visible ? (\n          <EyeOffIcon className=\"size-4\" />\n        ) : (\n          <EyeIcon className=\"size-4\" />\n        )}\n      </button>\n    </div>\n  );\n}\n\nfunction EyeIcon(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...props}\n    >\n      <path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z\" />\n      <circle cx=\"12\" cy=\"12\" r=\"3\" />\n    </svg>\n  );\n}\n\nfunction EyeOffIcon(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...props}\n    >\n      <path d=\"M9.9 5.1A9.4 9.4 0 0 1 12 5c6.5 0 10 7 10 7a16.8 16.8 0 0 1-3.1 4.1M6.2 6.2C3.7 7.9 2 12 2 12s3.5 7 10 7a9.7 9.7 0 0 0 5-1.4\" />\n      <path d=\"M14.1 14.1a3 3 0 1 1-4.2-4.2\" />\n      <path d=\"M2 2l20 20\" />\n    </svg>\n  );\n}\n"],"mappings":";;;;;;AAeA,MAAM,QAAmC;CACvC,IAAI;CACJ,IAAI;CACL;AAED,MAAM,WAAsC;CAC1C,IAAI;CACJ,IAAI;CACL;AAED,SAAgB,MAAM,EAAE,WAAW,OAAO,MAAM,MAAM,GAAG,SAAqB;AAC5E,KAAI,SAAS,WACX,QAAO,oBAAC,eAAD;EAA0B;EAAiB;EAAM,GAAI;EAAS,CAAA;AAGvE,QACE,oBAACA,SAAD;EACQ;EACN,WAAW,GACT,uEACA,yCACA,0DACA,sFACA,6BACA,yFACA,oGACA,wGACA,oDACA,gCACA,MAAM,OACN,SAAS,OACT,UACD;EACD,GAAI;EACJ,CAAA;;AAMN,SAAS,cAAc,EACrB,WACA,OAAO,MACP,UACA,GAAG,SACkB;CACrB,MAAM,CAAC,SAAS,cAAc,MAAM,SAAS,MAAM;CACnD,MAAM,cAAc,MAAM;CAC1B,MAAM,UAAU,gBAAgB,QAAQ,gBAAgB;AAExD,QACE,qBAAC,OAAD;EACE,WAAW,GACT,6EACA,sFACA,6BACA,sFACA,WAAW,6DACX,WACE,4EACF,YAAY,kCACZ,MAAM,OACN,UACD;YAZH,CAcE,oBAACA,SAAD;GACE,MAAM,UAAU,SAAS;GACf;GACV,WAAW,GACT,oEACA,yCACA,0DACA,gCACA,SAAS,MACV;GACD,GAAI;GACJ,CAAA,EACF,oBAAC,UAAD;GACE,MAAK;GACL,eAAe,YAAY,YAAY,CAAC,QAAQ;GACtC;GACV,cAAY,UAAU,uBAAuB;GAC7C,gBAAc;GACd,WAAW,GACT,6JACA,uDACA,uEACA,gCACA,SAAS,MACV;aAEA,UACC,oBAAC,YAAD,EAAY,WAAU,UAAW,CAAA,GAEjC,oBAAC,SAAD,EAAS,WAAU,UAAW,CAAA;GAEzB,CAAA,CACL;;;AAIV,SAAS,QAAQ,OAAoC;AACnD,QACE,qBAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,MAAK;EACL,QAAO;EACP,aAAY;EACZ,eAAc;EACd,gBAAe;EACf,GAAI;YARN,CAUE,oBAAC,QAAD,EAAM,GAAE,oDAAqD,CAAA,EAC7D,oBAAC,UAAD;GAAQ,IAAG;GAAK,IAAG;GAAK,GAAE;GAAM,CAAA,CAC5B;;;AAIV,SAAS,WAAW,OAAoC;AACtD,QACE,qBAAC,OAAD;EACE,OAAM;EACN,SAAQ;EACR,MAAK;EACL,QAAO;EACP,aAAY;EACZ,eAAc;EACd,gBAAe;EACf,GAAI;YARN;GAUE,oBAAC,QAAD,EAAM,GAAE,gIAAiI,CAAA;GACzI,oBAAC,QAAD,EAAM,GAAE,gCAAiC,CAAA;GACzC,oBAAC,QAAD,EAAM,GAAE,cAAe,CAAA;GACnB"}

package/dist/label.d.mts

@@ -0,0 +1,20 @@
+import * as React from "react";
+
+//#region src/components/label/label.d.ts
+type LabelSize = "small" | "base" | "large";
+type LabelWeight = "regular" | "plus";
+type LabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {
+  size?: LabelSize;
+  weight?: LabelWeight;
+  ref?: React.Ref<HTMLLabelElement>;
+};
+declare function Label({
+  className,
+  size,
+  weight,
+  ref,
+  ...props
+}: LabelProps): React.JSX.Element;
+//#endregion
+export { Label };
+//# sourceMappingURL=label.d.mts.map

package/dist/label.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.mts","names":[],"sources":["../src/components/label/label.tsx"],"mappings":";;;KAIK,SAAA;AAAA,KACA,WAAA;AAAA,KAEA,UAAA,GAAa,KAAA,CAAM,mBAAA,CAAoB,gBAAA;EAC1C,IAAA,GAAO,SAAA;EACP,MAAA,GAAS,WAAA;EACT,GAAA,GAAM,KAAA,CAAM,GAAA,CAAI,gBAAA;AAAA;AAAA,iBAGF,KAAA,CAAA;EACd,SAAA;EACA,IAAA;EACA,MAAA;EACA,GAAA;EAAA,GACG;AAAA,GACF,UAAA,GAAU,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/label.mjs

@@ -0,0 +1,19 @@
+import { t as cn } from "./cn-BpvCVwZv.mjs";
+import { Text } from "./text.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/label/label.tsx
+function Label({ className, size = "base", weight = "plus", ref, ...props }) {
+	return /* @__PURE__ */ jsx(Text, {
+		as: "label",
+		size,
+		weight,
+		ref,
+		className: cn("text-(--foreground)", className),
+		...props
+	});
+}
+//#endregion
+export { Label };
+
+//# sourceMappingURL=label.mjs.map

package/dist/label.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.mjs","names":[],"sources":["../src/components/label/label.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/lib/cn\";\nimport { Text } from \"../text/text\";\n\ntype LabelSize = \"small\" | \"base\" | \"large\";\ntype LabelWeight = \"regular\" | \"plus\";\n\ntype LabelProps = React.LabelHTMLAttributes<HTMLLabelElement> & {\n  size?: LabelSize;\n  weight?: LabelWeight;\n  ref?: React.Ref<HTMLLabelElement>;\n};\n\nexport function Label({\n  className,\n  size = \"base\",\n  weight = \"plus\",\n  ref,\n  ...props\n}: LabelProps) {\n  return (\n    <Text\n      as=\"label\"\n      size={size}\n      weight={weight}\n      ref={ref as React.Ref<HTMLElement>}\n      className={cn(\"text-(--foreground)\", className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;AAaA,SAAgB,MAAM,EACpB,WACA,OAAO,QACP,SAAS,QACT,KACA,GAAG,SACU;AACb,QACE,oBAAC,MAAD;EACE,IAAG;EACG;EACE;EACH;EACL,WAAW,GAAG,uBAAuB,UAAU;EAC/C,GAAI;EACJ,CAAA"}

package/dist/providers.d.mts

@@ -0,0 +1,12 @@
+import * as React from "react";
+
+//#region src/components/providers/providers.d.ts
+type ProvidersProps = {
+  children?: React.ReactNode;
+};
+declare function Providers({
+  children
+}: ProvidersProps): React.JSX.Element;
+//#endregion
+export { Providers };
+//# sourceMappingURL=providers.d.mts.map

package/dist/providers.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"providers.d.mts","names":[],"sources":["../src/components/providers/providers.tsx"],"mappings":";;;KAOK,cAAA;EACH,QAAA,GAAW,KAAA,CAAM,SAAA;AAAA;AAAA,iBAGH,SAAA,CAAA;EAAY;AAAA,GAAY,cAAA,GAAc,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/providers.mjs

@@ -0,0 +1,14 @@
+"use client";
+import { ConfirmProvider } from "./hooks/use-confirm.mjs";
+import { Toast } from "./toast.mjs";
+import { Tooltip } from "./tooltip.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/providers/providers.tsx
+function Providers({ children }) {
+	return /* @__PURE__ */ jsx(Toast.Provider, { children: /* @__PURE__ */ jsx(Tooltip.Provider, { children: /* @__PURE__ */ jsxs(ConfirmProvider, { children: [children, /* @__PURE__ */ jsx(Toast.Viewport, { children: /* @__PURE__ */ jsx(Toast.List, {}) })] }) }) });
+}
+//#endregion
+export { Providers };
+
+//# sourceMappingURL=providers.mjs.map

package/dist/providers.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"providers.mjs","names":[],"sources":["../src/components/providers/providers.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { ConfirmProvider } from \"../../hooks/use-confirm\";\nimport { Toast } from \"../toast/toast\";\nimport { Tooltip } from \"../tooltip/tooltip\";\n\ntype ProvidersProps = {\n  children?: React.ReactNode;\n};\n\nexport function Providers({ children }: ProvidersProps) {\n  return (\n    <Toast.Provider>\n      <Tooltip.Provider>\n        <ConfirmProvider>\n          {children}\n          <Toast.Viewport>\n            <Toast.List />\n          </Toast.Viewport>\n        </ConfirmProvider>\n      </Tooltip.Provider>\n    </Toast.Provider>\n  );\n}\n"],"mappings":";;;;;;;AAWA,SAAgB,UAAU,EAAE,YAA4B;AACtD,QACE,oBAAC,MAAM,UAAP,EAAA,UACE,oBAAC,QAAQ,UAAT,EAAA,UACE,qBAAC,iBAAD,EAAA,UAAA,CACG,UACD,oBAAC,MAAM,UAAP,EAAA,UACE,oBAAC,MAAM,MAAP,EAAc,CAAA,EACC,CAAA,CACD,EAAA,CAAA,EACD,CAAA,EACJ,CAAA"}

package/dist/text.d.mts

@@ -0,0 +1,30 @@
+import * as React from "react";
+
+//#region src/components/text/text.d.ts
+type TextSize = "small" | "base" | "large";
+type TextWeight = "regular" | "plus";
+type TextFamily = "sans" | "mono";
+type TextLeading = "normal" | "compact";
+type TextElement = "p" | "span" | "div" | "label";
+type TextProps = React.HTMLAttributes<HTMLElement> & {
+  as?: TextElement;
+  size?: TextSize;
+  weight?: TextWeight;
+  family?: TextFamily;
+  leading?: TextLeading;
+  htmlFor?: string;
+  ref?: React.Ref<HTMLElement>;
+};
+declare function Text({
+  className,
+  as: Tag,
+  size,
+  weight,
+  family,
+  leading,
+  ref,
+  ...props
+}: TextProps): React.JSX.Element;
+//#endregion
+export { Text };
+//# sourceMappingURL=text.d.mts.map

package/dist/text.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.mts","names":[],"sources":["../src/components/text/text.tsx"],"mappings":";;;KAGK,QAAA;AAAA,KACA,UAAA;AAAA,KACA,UAAA;AAAA,KACA,WAAA;AAAA,KACA,WAAA;AAAA,KA2BA,SAAA,GAAY,KAAA,CAAM,cAAA,CAAe,WAAA;EACpC,EAAA,GAAK,WAAA;EACL,IAAA,GAAO,QAAA;EACP,MAAA,GAAS,UAAA;EACT,MAAA,GAAS,UAAA;EACT,OAAA,GAAU,WAAA;EACV,OAAA;EACA,GAAA,GAAM,KAAA,CAAM,GAAA,CAAI,WAAA;AAAA;AAAA,iBAGF,IAAA,CAAA;EACd,SAAA;EACA,EAAA,EAAI,GAAA;EACJ,IAAA;EACA,MAAA;EACA,MAAA;EACA,OAAA;EACA,GAAA;EAAA,GACG;AAAA,GACF,SAAA,GAAS,KAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/text.mjs

@@ -0,0 +1,37 @@
+import { t as cn } from "./cn-BpvCVwZv.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/text/text.tsx
+const sizes = {
+	small: {
+		normal: "text-[0.8125rem] leading-6",
+		compact: "text-[0.8125rem] leading-5"
+	},
+	base: {
+		normal: "text-sm leading-6",
+		compact: "text-sm leading-5"
+	},
+	large: {
+		normal: "text-base leading-7",
+		compact: "text-base leading-5"
+	}
+};
+const weights = {
+	regular: "font-normal",
+	plus: "font-medium"
+};
+const families = {
+	sans: "font-sans",
+	mono: "font-mono"
+};
+function Text({ className, as: Tag = "p", size = "base", weight = "regular", family = "sans", leading = "normal", ref, ...props }) {
+	return /* @__PURE__ */ jsx(Tag, {
+		ref,
+		className: cn(sizes[size][leading], weights[weight], families[family], className),
+		...props
+	});
+}
+//#endregion
+export { Text };
+
+//# sourceMappingURL=text.mjs.map

package/dist/text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.mjs","names":["Element"],"sources":["../src/components/text/text.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/lib/cn\";\n\ntype TextSize = \"small\" | \"base\" | \"large\";\ntype TextWeight = \"regular\" | \"plus\";\ntype TextFamily = \"sans\" | \"mono\";\ntype TextLeading = \"normal\" | \"compact\";\ntype TextElement = \"p\" | \"span\" | \"div\" | \"label\";\n\nconst sizes: Record<TextSize, Record<TextLeading, string>> = {\n  small: {\n    normal: \"text-[0.8125rem] leading-6\",\n    compact: \"text-[0.8125rem] leading-5\",\n  },\n  base: {\n    normal: \"text-sm leading-6\",\n    compact: \"text-sm leading-5\",\n  },\n  large: {\n    normal: \"text-base leading-7\",\n    compact: \"text-base leading-5\",\n  },\n};\n\nconst weights: Record<TextWeight, string> = {\n  regular: \"font-normal\",\n  plus: \"font-medium\",\n};\n\nconst families: Record<TextFamily, string> = {\n  sans: \"font-sans\",\n  mono: \"font-mono\",\n};\n\ntype TextProps = React.HTMLAttributes<HTMLElement> & {\n  as?: TextElement;\n  size?: TextSize;\n  weight?: TextWeight;\n  family?: TextFamily;\n  leading?: TextLeading;\n  htmlFor?: string;\n  ref?: React.Ref<HTMLElement>;\n};\n\nexport function Text({\n  className,\n  as: Tag = \"p\",\n  size = \"base\",\n  weight = \"regular\",\n  family = \"sans\",\n  leading = \"normal\",\n  ref,\n  ...props\n}: TextProps) {\n  const Element = Tag as React.ElementType;\n\n  return (\n    <Element\n      ref={ref}\n      className={cn(\n        sizes[size][leading],\n        weights[weight],\n        families[family],\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;AASA,MAAM,QAAuD;CAC3D,OAAO;EACL,QAAQ;EACR,SAAS;EACV;CACD,MAAM;EACJ,QAAQ;EACR,SAAS;EACV;CACD,OAAO;EACL,QAAQ;EACR,SAAS;EACV;CACF;AAED,MAAM,UAAsC;CAC1C,SAAS;CACT,MAAM;CACP;AAED,MAAM,WAAuC;CAC3C,MAAM;CACN,MAAM;CACP;AAYD,SAAgB,KAAK,EACnB,WACA,IAAI,MAAM,KACV,OAAO,QACP,SAAS,WACT,SAAS,QACT,UAAU,UACV,KACA,GAAG,SACS;AAGZ,QACE,oBAACA,KAAD;EACO;EACL,WAAW,GACT,MAAM,MAAM,UACZ,QAAQ,SACR,SAAS,SACT,UACD;EACD,GAAI;EACJ,CAAA"}

package/dist/toast.d.mts

@@ -0,0 +1,56 @@
+import * as React from "react";
+import { Toast as Toast$1 } from "@base-ui/react/toast";
+
+//#region src/components/toast/toast.d.ts
+type ToastProviderProps = React.ComponentPropsWithoutRef<typeof Toast$1.Provider>;
+declare function ToastProvider(props: ToastProviderProps): React.JSX.Element;
+type ToastViewportProps = React.ComponentPropsWithoutRef<typeof Toast$1.Viewport>;
+declare function ToastViewport({
+  className,
+  ...props
+}: ToastViewportProps): React.JSX.Element;
+type ToastRootProps = React.ComponentPropsWithoutRef<typeof Toast$1.Root>;
+declare function ToastRoot({
+  className,
+  ...props
+}: ToastRootProps): React.JSX.Element;
+type ToastContentProps = React.ComponentPropsWithoutRef<typeof Toast$1.Content>;
+declare function ToastContent({
+  className,
+  ...props
+}: ToastContentProps): React.JSX.Element;
+type ToastTitleProps = React.ComponentPropsWithoutRef<typeof Toast$1.Title>;
+declare function ToastTitle({
+  className,
+  ...props
+}: ToastTitleProps): React.JSX.Element;
+type ToastDescriptionProps = React.ComponentPropsWithoutRef<typeof Toast$1.Description>;
+declare function ToastDescription({
+  className,
+  ...props
+}: ToastDescriptionProps): React.JSX.Element;
+type ToastIconProps = React.SVGProps<SVGSVGElement> & {
+  type: string | undefined;
+};
+declare function ToastIcon({
+  type,
+  className,
+  ...props
+}: ToastIconProps): React.JSX.Element | null;
+type ToastCloseProps = React.ComponentPropsWithoutRef<typeof Toast$1.Close>;
+declare function ToastClose(props: ToastCloseProps): React.JSX.Element;
+declare function ToastList(): React.JSX.Element[];
+declare const Toast: typeof ToastRoot & {
+  Provider: typeof ToastProvider;
+  Viewport: typeof ToastViewport;
+  Content: typeof ToastContent;
+  Title: typeof ToastTitle;
+  Description: typeof ToastDescription;
+  Close: typeof ToastClose;
+  Icon: typeof ToastIcon;
+  List: typeof ToastList;
+  useToastManager: typeof Toast$1.useToastManager;
+};
+//#endregion
+export { Toast };
+//# sourceMappingURL=toast.d.mts.map

package/dist/toast.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.d.mts","names":[],"sources":["../src/components/toast/toast.tsx"],"mappings":";;;;KAQK,kBAAA,GAAqB,KAAA,CAAM,wBAAA,QACvB,OAAA,CAAU,QAAA;AAAA,iBAGV,aAAA,CAAc,KAAA,EAAO,kBAAA,GAAkB,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAI3C,kBAAA,GAAqB,KAAA,CAAM,wBAAA,QACvB,OAAA,CAAU,QAAA;AAAA,iBAGV,aAAA,CAAA;EAAgB,SAAA;EAAA,GAAc;AAAA,GAAS,kBAAA,GAAkB,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAc7D,cAAA,GAAiB,KAAA,CAAM,wBAAA,QAAgC,OAAA,CAAU,IAAA;AAAA,iBAE7D,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KA6BrD,iBAAA,GAAoB,KAAA,CAAM,wBAAA,QACtB,OAAA,CAAU,OAAA;AAAA,iBAGV,YAAA,CAAA;EAAe,SAAA;EAAA,GAAc;AAAA,GAAS,iBAAA,GAAiB,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAa3D,eAAA,GAAkB,KAAA,CAAM,wBAAA,QAAgC,OAAA,CAAU,KAAA;AAAA,iBAE9D,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,eAAA,GAAe,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KASvD,qBAAA,GAAwB,KAAA,CAAM,wBAAA,QAC1B,OAAA,CAAU,WAAA;AAAA,iBAGV,gBAAA,CAAA;EAAmB,SAAA;EAAA,GAAc;AAAA,GAAS,qBAAA,GAAqB,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAuFnE,cAAA,GAAiB,KAAA,CAAM,QAAA,CAAS,aAAA;EACnC,IAAA;AAAA;AAAA,iBAGO,SAAA,CAAA;EAAY,IAAA;EAAM,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,KAgB3D,eAAA,GAAkB,KAAA,CAAM,wBAAA,QAAgC,OAAA,CAAU,KAAA;AAAA,iBAE9D,UAAA,CAAW,KAAA,EAAO,eAAA,GAAe,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBASjC,SAAA,CAAA,GAAS,KAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAiBL,KAAA,SAAK,SAAA"}