@lumeweb/portal-framework-ui 0.0.1 → 0.1.1

package/LICENSE

@@ -0,0 +1,9 @@
+MIT License
+
+Copyright (c) 2024-2026 Hammer Technologies LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -1,45 +1 @@
-# @lumeweb/portal-framework-ui
-
-## ⚠️ IMPORTANT NOTICE ⚠️
-
-**This package is created solely for the purpose of setting up OIDC (OpenID Connect) trusted publishing with npm.**
-
-This is **NOT** a functional package and contains **NO** code or functionality beyond the OIDC setup configuration.
-
-## Purpose
-
-This package exists to:
-1. Configure OIDC trusted publishing for the package name `@lumeweb/portal-framework-ui`
-2. Enable secure, token-less publishing from CI/CD workflows
-3. Establish provenance for packages published under this name
-
-## What is OIDC Trusted Publishing?
-
-OIDC trusted publishing allows package maintainers to publish packages directly from their CI/CD workflows without needing to manage npm access tokens. Instead, it uses OpenID Connect to establish trust between the CI/CD provider (like GitHub Actions) and npm.
-
-## Setup Instructions
-
-To properly configure OIDC trusted publishing for this package:
-
-1. Go to [npmjs.com](https://www.npmjs.com/) and navigate to your package settings
-2. Configure the trusted publisher (e.g., GitHub Actions)
-3. Specify the repository and workflow that should be allowed to publish
-4. Use the configured workflow to publish your actual package
-
-## DO NOT USE THIS PACKAGE
-
-This package is a placeholder for OIDC configuration only. It:
-- Contains no executable code
-- Provides no functionality
-- Should not be installed as a dependency
-- Exists only for administrative purposes
-
-## More Information
-
-For more details about npm's trusted publishing feature, see:
-- [npm Trusted Publishing Documentation](https://docs.npmjs.com/generating-provenance-statements)
-- [GitHub Actions OIDC Documentation](https://docs.github.com/en/actions/deployment/security-hardening-your-deployments/about-security-hardening-with-openid-connect)
-
----
-
-**Maintained for OIDC setup purposes only**
+# `@lumeweb/portal-framework-ui`

package/dist/esm/components/Copyable.d.ts

@@ -0,0 +1,43 @@
+//#region src/components/Copyable.d.ts
+interface CopyableProps {
+  /**
+   * The text to be copied
+   */
+  text: string;
+  /**
+   * The display text (if different from the copied text)
+   */
+  displayText?: string;
+  /**
+   * Maximum length before truncating (default: 20)
+   */
+  maxLength?: number;
+  /**
+   * Additional CSS classes
+   */
+  className?: string;
+  /**
+   * Tooltip text for copy action (default: "Copy")
+   */
+  copyTooltip?: string;
+  /**
+   * Tooltip text when copied (default: "Copied!")
+   */
+  copiedTooltip?: string;
+  /**
+   * Whether to show the copy icon (default: true)
+   */
+  showIcon?: boolean;
+}
+declare function Copyable({
+  text,
+  displayText,
+  maxLength,
+  className,
+  copyTooltip,
+  copiedTooltip,
+  showIcon
+}: CopyableProps): any;
+//#endregion
+export { Copyable };
+//# sourceMappingURL=Copyable.d.ts.map

package/dist/esm/components/Copyable.js

@@ -0,0 +1,50 @@
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, cn } from "@lumeweb/portal-framework-ui-core";
+import React, { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check, Copy } from "lucide-react";
+
+//#region src/components/Copyable.tsx
+function Copyable({ text, displayText, maxLength = 20, className, copyTooltip = "Copy", copiedTooltip = "Copied!", showIcon = true }) {
+	const [isCopied, setIsCopied] = useState(false);
+	const timerRef = useRef(null);
+	useEffect(() => {
+		return () => {
+			if (timerRef.current) clearTimeout(timerRef.current);
+		};
+	}, []);
+	const handleCopy = async () => {
+		try {
+			await navigator.clipboard.writeText(text);
+			setIsCopied(true);
+			if (timerRef.current) clearTimeout(timerRef.current);
+			timerRef.current = setTimeout(() => {
+				setIsCopied(false);
+				timerRef.current = null;
+			}, 2e3);
+		} catch (err) {
+			console.error("Failed to copy text: ", err);
+		}
+	};
+	const textToDisplay = displayText || text;
+	const truncatedText = textToDisplay.length > maxLength ? `${textToDisplay.substring(0, maxLength)}...` : textToDisplay;
+	return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ jsxs("button", {
+			type: "button",
+			onClick: handleCopy,
+			"aria-label": isCopied ? copiedTooltip : copyTooltip,
+			className: cn("inline-flex items-center gap-1 text-sm hover:bg-muted/50 rounded px-2 py-1 transition-colors", "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", className),
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "font-mono",
+				children: truncatedText
+			}), showIcon && /* @__PURE__ */ jsx("span", {
+				className: "text-muted-foreground",
+				children: isCopied ? /* @__PURE__ */ jsx(Check, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3 w-3" })
+			})]
+		})
+	}), /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: isCopied ? copiedTooltip : copyTooltip }) })] }) });
+}
+
+//#endregion
+export { Copyable };
+//# sourceMappingURL=Copyable.js.map

package/dist/esm/components/Copyable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Copyable.js","names":[],"sources":["../../../src/components/Copyable.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from \"react\";\nimport { Copy, Check } from \"lucide-react\";\nimport { cn, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from \"@lumeweb/portal-framework-ui-core\";\n\ninterface CopyableProps {\n  /**\n   * The text to be copied\n   */\n  text: string;\n  /**\n   * The display text (if different from the copied text)\n   */\n  displayText?: string;\n  /**\n   * Maximum length before truncating (default: 20)\n   */\n  maxLength?: number;\n  /**\n   * Additional CSS classes\n   */\n  className?: string;\n  /**\n   * Tooltip text for copy action (default: \"Copy\")\n   */\n  copyTooltip?: string;\n  /**\n   * Tooltip text when copied (default: \"Copied!\")\n   */\n  copiedTooltip?: string;\n  /**\n   * Whether to show the copy icon (default: true)\n   */\n  showIcon?: boolean;\n}\n\nexport function Copyable({\n  text,\n  displayText,\n  maxLength = 20,\n  className,\n  copyTooltip = \"Copy\",\n  copiedTooltip = \"Copied!\",\n  showIcon = true,\n}: CopyableProps) {\n  const [isCopied, setIsCopied] = useState(false);\n  const timerRef = useRef<NodeJS.Timeout | null>(null);\n\n  useEffect(() => {\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, []);\n\n  const handleCopy = async () => {\n    try {\n      await navigator.clipboard.writeText(text);\n      setIsCopied(true);\n      \n      // Clear any existing timer before setting a new one\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n      \n      // Set new timer and store its ID in the ref\n      timerRef.current = setTimeout(() => {\n        setIsCopied(false);\n        timerRef.current = null;\n      }, 2000);\n    } catch (err) {\n      console.error(\"Failed to copy text: \", err);\n    }\n  };\n\n  const textToDisplay = displayText || text;\n  const truncatedText = textToDisplay.length > maxLength \n    ? `${textToDisplay.substring(0, maxLength)}...` \n    : textToDisplay;\n\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            aria-label={isCopied ? copiedTooltip : copyTooltip}\n            className={cn(\n              \"inline-flex items-center gap-1 text-sm hover:bg-muted/50 rounded px-2 py-1 transition-colors\",\n              \"focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\",\n              className\n            )}\n          >\n            <span className=\"font-mono\">{truncatedText}</span>\n            {showIcon && (\n              <span className=\"text-muted-foreground\">\n                {isCopied ? (\n                  <Check className=\"h-3 w-3\" />\n                ) : (\n                  <Copy className=\"h-3 w-3\" />\n                )}\n              </span>\n            )}\n          </button>\n        </TooltipTrigger>\n        <TooltipContent>\n          <p>{isCopied ? copiedTooltip : copyTooltip}</p>\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n}\n"],"mappings":";;;;;;AAmCA,SAAgB,SAAS,EACvB,MACA,aACA,YAAY,IACZ,WACA,cAAc,QACd,gBAAgB,WAChB,WAAW,QACK;CAChB,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAC/C,MAAM,WAAW,OAA8B,KAAK;AAEpD,iBAAgB;AACd,eAAa;AACX,OAAI,SAAS,QACX,cAAa,SAAS,QAAQ;;IAGjC,EAAE,CAAC;CAEN,MAAM,aAAa,YAAY;AAC7B,MAAI;AACF,SAAM,UAAU,UAAU,UAAU,KAAK;AACzC,eAAY,KAAK;AAGjB,OAAI,SAAS,QACX,cAAa,SAAS,QAAQ;AAIhC,YAAS,UAAU,iBAAiB;AAClC,gBAAY,MAAM;AAClB,aAAS,UAAU;MAClB,IAAK;WACD,KAAK;AACZ,WAAQ,MAAM,yBAAyB,IAAI;;;CAI/C,MAAM,gBAAgB,eAAe;CACrC,MAAM,gBAAgB,cAAc,SAAS,YACzC,GAAG,cAAc,UAAU,GAAG,UAAU,CAAC,OACzC;AAEJ,QACE,oBAAC,iBAAD,YACE,qBAAC,SAAD,aACE,oBAAC,gBAAD;EAAgB;YACd,qBAAC,UAAD;GACE,MAAK;GACL,SAAS;GACT,cAAY,WAAW,gBAAgB;GACvC,WAAW,GACT,gGACA,uEACA,UACD;aARH,CAUE,oBAAC,QAAD;IAAM,WAAU;cAAa;IAAqB,GACjD,YACC,oBAAC,QAAD;IAAM,WAAU;cACb,WACC,oBAAC,OAAD,EAAO,WAAU,WAAY,IAE7B,oBAAC,MAAD,EAAM,WAAU,WAAY;IAEzB,EAEF;;EACM,GACjB,oBAAC,gBAAD,YACE,oBAAC,KAAD,YAAI,WAAW,gBAAgB,aAAgB,GAChC,EACT,KACM"}

package/dist/esm/components/FilterChip.d.ts

@@ -0,0 +1,16 @@
+//#region src/components/FilterChip.d.ts
+type FilterChipVariant = "date" | "default" | "numeric" | "text";
+declare function FilterChip({
+  className,
+  label,
+  onRemove,
+  variant
+}: {
+  className?: string;
+  label: string;
+  onRemove: () => void;
+  variant?: FilterChipVariant;
+}): any;
+//#endregion
+export { FilterChip };
+//# sourceMappingURL=FilterChip.d.ts.map

package/dist/esm/components/FilterChip.js

@@ -0,0 +1,47 @@
+import { ThemedBadge } from "./ThemedBadge.js";
+import { Button, cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+
+//#region src/components/FilterChip.tsx
+const FILTER_CHIP_THEME = {
+	date: {
+		base: "bg-blue-100 text-blue-800",
+		dark: "dark:bg-blue-900/20 dark:text-blue-200",
+		hover: "hover:bg-blue-200/80 dark:hover:bg-blue-800/80"
+	},
+	default: {
+		base: "bg-muted/40 text-muted-foreground",
+		dark: "dark:bg-gray-700 dark:text-gray-300",
+		hover: "hover:bg-muted/60 dark:hover:bg-gray-600"
+	},
+	numeric: {
+		base: "bg-purple-100 text-purple-800",
+		dark: "dark:bg-purple-900/20 dark:text-purple-200",
+		hover: "hover:bg-purple-200/80 dark:hover:bg-purple-800/80"
+	},
+	text: {
+		base: "bg-green-100 text-green-800",
+		dark: "dark:bg-green-900/20 dark:text-green-200",
+		hover: "hover:bg-green-200/80 dark:hover:bg-green-800/80"
+	}
+};
+function FilterChip({ className, label, onRemove, variant = "default" }) {
+	return /* @__PURE__ */ jsxs(ThemedBadge, {
+		className: cn("gap-1 pr-1.5", className),
+		config: FILTER_CHIP_THEME,
+		value: variant,
+		children: [/* @__PURE__ */ jsx("span", { children: label }), /* @__PURE__ */ jsx(Button, {
+			"aria-label": `Remove ${label} filter`,
+			className: "ml-1 h-5 w-5 p-0 hover:bg-transparent",
+			onClick: onRemove,
+			variant: "ghost",
+			children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
+		})]
+	});
+}
+
+//#endregion
+export { FilterChip };
+//# sourceMappingURL=FilterChip.js.map

package/dist/esm/components/FilterChip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterChip.js","names":[],"sources":["../../../src/components/FilterChip.tsx"],"sourcesContent":["import { Button, cn } from \"@lumeweb/portal-framework-ui-core\";\nimport { X } from \"lucide-react\";\nimport React from \"react\";\n\nimport { ThemedBadge } from \"@/components/ThemedBadge\";\nimport { type BadgeConfig } from \"@/types\";\n\ntype FilterChipVariant = \"date\" | \"default\" | \"numeric\" | \"text\";\n\nconst FILTER_CHIP_THEME: BadgeConfig<FilterChipVariant> = {\n  date: {\n    base: \"bg-blue-100 text-blue-800\",\n    dark: \"dark:bg-blue-900/20 dark:text-blue-200\",\n    hover: \"hover:bg-blue-200/80 dark:hover:bg-blue-800/80\",\n  },\n  default: {\n    base: \"bg-muted/40 text-muted-foreground\",\n    dark: \"dark:bg-gray-700 dark:text-gray-300\",\n    hover: \"hover:bg-muted/60 dark:hover:bg-gray-600\",\n  },\n  numeric: {\n    base: \"bg-purple-100 text-purple-800\",\n    dark: \"dark:bg-purple-900/20 dark:text-purple-200\",\n    hover: \"hover:bg-purple-200/80 dark:hover:bg-purple-800/80\",\n  },\n  text: {\n    base: \"bg-green-100 text-green-800\",\n    dark: \"dark:bg-green-900/20 dark:text-green-200\",\n    hover: \"hover:bg-green-200/80 dark:hover:bg-green-800/80\",\n  },\n};\n\nexport function FilterChip({\n  className,\n  label,\n  onRemove,\n  variant = \"default\",\n}: {\n  className?: string;\n  label: string;\n  onRemove: () => void;\n  variant?: FilterChipVariant;\n}) {\n  return (\n    <ThemedBadge\n      className={cn(\"gap-1 pr-1.5\", className)}\n      config={FILTER_CHIP_THEME}\n      value={variant}>\n      <span>{label}</span>\n      <Button\n        aria-label={`Remove ${label} filter`}\n        className=\"ml-1 h-5 w-5 p-0 hover:bg-transparent\"\n        onClick={onRemove}\n        variant=\"ghost\">\n        <X className=\"h-3.5 w-3.5\" />\n      </Button>\n    </ThemedBadge>\n  );\n}\n"],"mappings":";;;;;;;AASA,MAAM,oBAAoD;CACxD,MAAM;EACJ,MAAM;EACN,MAAM;EACN,OAAO;EACR;CACD,SAAS;EACP,MAAM;EACN,MAAM;EACN,OAAO;EACR;CACD,SAAS;EACP,MAAM;EACN,MAAM;EACN,OAAO;EACR;CACD,MAAM;EACJ,MAAM;EACN,MAAM;EACN,OAAO;EACR;CACF;AAED,SAAgB,WAAW,EACzB,WACA,OACA,UACA,UAAU,aAMT;AACD,QACE,qBAAC,aAAD;EACE,WAAW,GAAG,gBAAgB,UAAU;EACxC,QAAQ;EACR,OAAO;YAHT,CAIE,oBAAC,QAAD,YAAO,OAAa,GACpB,oBAAC,QAAD;GACE,cAAY,UAAU,MAAM;GAC5B,WAAU;GACV,SAAS;GACT,SAAQ;aACR,oBAAC,GAAD,EAAG,WAAU,eAAgB;GACtB,EACG"}

package/dist/esm/components/Forms.d.ts

@@ -0,0 +1,55 @@
+import { Checkbox } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { FieldName } from "@conform-to/react";
+
+//#region src/components/Forms.d.ts
+declare const Field: ({
+  className,
+  errors,
+  inputProps,
+  labelProps
+}: {
+  className?: string;
+  errors?: ListOfErrors;
+  inputProps: React.HTMLProps<HTMLInputElement> & {
+    name: FieldName<string>;
+  };
+  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;
+}) => any;
+declare const FieldCheckbox: ({
+  className,
+  errors,
+  inputProps,
+  labelProps
+}: {
+  className?: string;
+  errors?: ListOfErrors;
+  inputProps: React.ComponentPropsWithoutRef<typeof Checkbox> & {
+    form: string;
+    name: string;
+    value?: string;
+  };
+  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;
+}) => any;
+type ListOfErrors = (null | string | undefined)[] | null | undefined;
+declare function ErrorList({
+  errors,
+  id
+}: {
+  errors?: ListOfErrors;
+  id?: string;
+}): any;
+declare function TextareaField({
+  className,
+  errors,
+  labelProps,
+  textareaProps
+}: {
+  className?: string;
+  errors?: ListOfErrors;
+  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;
+  textareaProps: React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+}): any;
+//#endregion
+export { ErrorList, Field, FieldCheckbox, ListOfErrors, TextareaField };
+//# sourceMappingURL=Forms.d.ts.map

package/dist/esm/components/Forms.js

@@ -0,0 +1,123 @@
+import { Checkbox, Input, Label, Textarea, cn } from "@lumeweb/portal-framework-ui-core";
+import React, { useId } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useInputControl } from "@conform-to/react";
+
+//#region src/components/Forms.tsx
+const Field = ({ className, errors, inputProps, labelProps }) => {
+	const fallbackId = useId();
+	const id = inputProps.id ?? fallbackId;
+	const errorId = errors?.length ? `${id}-error` : void 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		children: [
+			/* @__PURE__ */ jsx(Label, {
+				...labelProps,
+				className: "text-secondary-foreground text-sm font-semibold",
+				htmlFor: id
+			}),
+			/* @__PURE__ */ jsx(Input, {
+				...inputProps,
+				"aria-describedby": errorId,
+				"aria-invalid": errorId ? true : void 0,
+				className: "bg-input border-border placeholder-input-placeholder mt-4",
+				id
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "min-h-[32px] px-4 pb-3 pt-1",
+				children: errorId ? /* @__PURE__ */ jsx(ErrorList, {
+					errors,
+					id: errorId
+				}) : null
+			})
+		]
+	});
+};
+const FieldCheckbox = ({ className, errors, inputProps, labelProps }) => {
+	const { defaultChecked, key, ...checkboxProps } = inputProps;
+	const checkedValue = inputProps.value ?? "on";
+	const input = useInputControl({
+		formId: inputProps.form,
+		initialValue: defaultChecked ? checkedValue : void 0,
+		key,
+		name: inputProps.name
+	});
+	const fallbackId = useId();
+	const id = inputProps.id ?? fallbackId;
+	const errorId = errors?.length ? `${id}-error` : void 0;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
+		className: cn("text-foreground flex items-center space-x-2", className),
+		children: [/* @__PURE__ */ jsx(Checkbox, {
+			...checkboxProps,
+			"aria-describedby": errorId,
+			"aria-invalid": errorId ? true : void 0,
+			checked: input.value === checkedValue,
+			id,
+			onBlur: (event) => {
+				input.blur();
+				inputProps.onBlur?.(event);
+			},
+			onCheckedChange: (state) => {
+				input.change(state.valueOf() ? checkedValue : "");
+				inputProps.onCheckedChange?.(state);
+			},
+			onFocus: (event) => {
+				input.focus();
+				inputProps.onFocus?.(event);
+			},
+			type: "button"
+		}), /* @__PURE__ */ jsx(Label, {
+			...labelProps,
+			htmlFor: id
+		})]
+	}), /* @__PURE__ */ jsx("div", {
+		className: "min-h-[32px] px-4 pb-3 pt-1",
+		children: errorId ? /* @__PURE__ */ jsx(ErrorList, {
+			errors,
+			id: errorId
+		}) : null
+	})] });
+};
+function ErrorList({ errors, id }) {
+	const errorsToRender = errors?.filter(Boolean);
+	if (!errorsToRender?.length) return null;
+	return /* @__PURE__ */ jsx("ul", {
+		className: "flex flex-col gap-1",
+		id,
+		children: errorsToRender.map((e) => /* @__PURE__ */ jsx("li", {
+			className: "text-destructive-foreground text-[12px]",
+			children: e
+		}, e))
+	});
+}
+function TextareaField({ className, errors, labelProps, textareaProps }) {
+	const fallbackId = useId();
+	const id = textareaProps.id ?? textareaProps.name ?? fallbackId;
+	const errorId = errors?.length ? `${id}-error` : void 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		children: [
+			/* @__PURE__ */ jsx(Label, {
+				htmlFor: id,
+				...labelProps
+			}),
+			/* @__PURE__ */ jsx(Textarea, {
+				"aria-describedby": errorId,
+				"aria-invalid": errorId ? true : void 0,
+				id,
+				...textareaProps
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "min-h-[32px] pb-1 pt-1",
+				children: errorId ? /* @__PURE__ */ jsx(ErrorList, {
+					errors,
+					id: errorId
+				}) : null
+			})
+		]
+	});
+}
+
+//#endregion
+export { ErrorList, Field, FieldCheckbox, TextareaField };
+//# sourceMappingURL=Forms.js.map

package/dist/esm/components/Forms.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Forms.js","names":[],"sources":["../../../src/components/Forms.tsx"],"sourcesContent":["import { type FieldName, useInputControl } from \"@conform-to/react\";\nimport {\n  Checkbox,\n  cn,\n  Input,\n  Label,\n  Textarea,\n} from \"@lumeweb/portal-framework-ui-core\";\nimport React, { useId } from \"react\";\n\nexport const Field = ({\n  className,\n  errors,\n  inputProps,\n  labelProps,\n}: {\n  className?: string;\n  errors?: ListOfErrors;\n  inputProps: React.HTMLProps<HTMLInputElement> & {\n    name: FieldName<string>;\n  };\n  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;\n}) => {\n  const fallbackId = useId();\n  const id = inputProps.id ?? fallbackId;\n  const errorId = errors?.length ? `${id}-error` : undefined;\n  return (\n    <div className={className}>\n      <Label\n        {...labelProps}\n        className=\"text-secondary-foreground text-sm font-semibold\"\n        htmlFor={id}\n      />\n      <Input\n        {...inputProps}\n        aria-describedby={errorId}\n        aria-invalid={errorId ? true : undefined}\n        className=\"bg-input border-border placeholder-input-placeholder mt-4\"\n        id={id}\n      />\n      <div className=\"min-h-[32px] px-4 pb-3 pt-1\">\n        {errorId ? <ErrorList errors={errors} id={errorId} /> : null}\n      </div>\n    </div>\n  );\n};\n\nexport const FieldCheckbox = ({\n  className,\n  errors,\n  inputProps,\n  labelProps,\n}: {\n  className?: string;\n  errors?: ListOfErrors;\n  inputProps: React.ComponentPropsWithoutRef<typeof Checkbox> & {\n    form: string;\n    name: string;\n    value?: string;\n  };\n  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;\n}) => {\n  const { defaultChecked, key, ...checkboxProps } = inputProps;\n  const checkedValue = inputProps.value ?? \"on\";\n  const input = useInputControl({\n    formId: inputProps.form,\n    initialValue: defaultChecked ? checkedValue : undefined,\n    key,\n    name: inputProps.name,\n  });\n  const fallbackId = useId();\n  const id = inputProps.id ?? fallbackId;\n  const errorId = errors?.length ? `${id}-error` : undefined;\n  return (\n    <>\n      <div\n        className={cn(\n          \"text-foreground flex items-center space-x-2\",\n          className,\n        )}>\n        <Checkbox\n          {...checkboxProps}\n          aria-describedby={errorId}\n          aria-invalid={errorId ? true : undefined}\n          checked={input.value === checkedValue}\n          id={id}\n          onBlur={(event) => {\n            input.blur();\n            inputProps.onBlur?.(event);\n          }}\n          onCheckedChange={(state) => {\n            input.change(state.valueOf() ? checkedValue : \"\");\n            inputProps.onCheckedChange?.(state);\n          }}\n          onFocus={(event) => {\n            input.focus();\n            inputProps.onFocus?.(event);\n          }}\n          type=\"button\"\n        />\n        <Label {...labelProps} htmlFor={id} />\n      </div>\n      <div className=\"min-h-[32px] px-4 pb-3 pt-1\">\n        {errorId ? <ErrorList errors={errors} id={errorId} /> : null}\n      </div>\n    </>\n  );\n};\n\nexport type ListOfErrors = (null | string | undefined)[] | null | undefined;\n\nexport function ErrorList({\n  errors,\n  id,\n}: {\n  errors?: ListOfErrors;\n  id?: string;\n}) {\n  const errorsToRender = errors?.filter(Boolean);\n  if (!errorsToRender?.length) return null;\n  return (\n    <ul className=\"flex flex-col gap-1\" id={id}>\n      {errorsToRender.map((e) => (\n        <li className=\"text-destructive-foreground text-[12px]\" key={e}>\n          {e}\n        </li>\n      ))}\n    </ul>\n  );\n}\nexport function TextareaField({\n  className,\n  errors,\n  labelProps,\n  textareaProps,\n}: {\n  className?: string;\n  errors?: ListOfErrors;\n  labelProps: React.LabelHTMLAttributes<HTMLLabelElement>;\n  textareaProps: React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n}) {\n  const fallbackId = useId();\n  const id = textareaProps.id ?? textareaProps.name ?? fallbackId;\n  const errorId = errors?.length ? `${id}-error` : undefined;\n  return (\n    <div className={className}>\n      <Label htmlFor={id} {...labelProps} />\n      <Textarea\n        aria-describedby={errorId}\n        aria-invalid={errorId ? true : undefined}\n        id={id}\n        {...textareaProps}\n      />\n      <div className=\"min-h-[32px] pb-1 pt-1\">\n        {errorId ? <ErrorList errors={errors} id={errorId} /> : null}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,MAAa,SAAS,EACpB,WACA,QACA,YACA,iBAQI;CACJ,MAAM,aAAa,OAAO;CAC1B,MAAM,KAAK,WAAW,MAAM;CAC5B,MAAM,UAAU,QAAQ,SAAS,GAAG,GAAG,UAAU;AACjD,QACE,qBAAC,OAAD;EAAgB;YAAhB;GACE,oBAAC,OAAD;IACE,GAAI;IACJ,WAAU;IACV,SAAS;IACT;GACF,oBAAC,OAAD;IACE,GAAI;IACJ,oBAAkB;IAClB,gBAAc,UAAU,OAAO;IAC/B,WAAU;IACN;IACJ;GACF,oBAAC,OAAD;IAAK,WAAU;cACZ,UAAU,oBAAC,WAAD;KAAmB;KAAQ,IAAI;KAAW,IAAG;IACpD;GACF;;;AAIV,MAAa,iBAAiB,EAC5B,WACA,QACA,YACA,iBAUI;CACJ,MAAM,EAAE,gBAAgB,KAAK,GAAG,kBAAkB;CAClD,MAAM,eAAe,WAAW,SAAS;CACzC,MAAM,QAAQ,gBAAgB;EAC5B,QAAQ,WAAW;EACnB,cAAc,iBAAiB,eAAe;EAC9C;EACA,MAAM,WAAW;EAClB,CAAC;CACF,MAAM,aAAa,OAAO;CAC1B,MAAM,KAAK,WAAW,MAAM;CAC5B,MAAM,UAAU,QAAQ,SAAS,GAAG,GAAG,UAAU;AACjD,QACE,4CACE,qBAAC,OAAD;EACE,WAAW,GACT,+CACA,UACD;YAJH,CAKE,oBAAC,UAAD;GACE,GAAI;GACJ,oBAAkB;GAClB,gBAAc,UAAU,OAAO;GAC/B,SAAS,MAAM,UAAU;GACrB;GACJ,SAAS,UAAU;AACjB,UAAM,MAAM;AACZ,eAAW,SAAS,MAAM;;GAE5B,kBAAkB,UAAU;AAC1B,UAAM,OAAO,MAAM,SAAS,GAAG,eAAe,GAAG;AACjD,eAAW,kBAAkB,MAAM;;GAErC,UAAU,UAAU;AAClB,UAAM,OAAO;AACb,eAAW,UAAU,MAAM;;GAE7B,MAAK;GACL,GACF,oBAAC,OAAD;GAAO,GAAI;GAAY,SAAS;GAAM,EAClC;KACN,oBAAC,OAAD;EAAK,WAAU;YACZ,UAAU,oBAAC,WAAD;GAAmB;GAAQ,IAAI;GAAW,IAAG;EACpD,EACL;;AAMP,SAAgB,UAAU,EACxB,QACA,MAIC;CACD,MAAM,iBAAiB,QAAQ,OAAO,QAAQ;AAC9C,KAAI,CAAC,gBAAgB,OAAQ,QAAO;AACpC,QACE,oBAAC,MAAD;EAAI,WAAU;EAA0B;YACrC,eAAe,KAAK,MACnB,oBAAC,MAAD;GAAI,WAAU;aACX;GACE,EAFwD,EAExD,CACL;EACC;;AAGT,SAAgB,cAAc,EAC5B,WACA,QACA,YACA,iBAMC;CACD,MAAM,aAAa,OAAO;CAC1B,MAAM,KAAK,cAAc,MAAM,cAAc,QAAQ;CACrD,MAAM,UAAU,QAAQ,SAAS,GAAG,GAAG,UAAU;AACjD,QACE,qBAAC,OAAD;EAAgB;YAAhB;GACE,oBAAC,OAAD;IAAO,SAAS;IAAI,GAAI;IAAc;GACtC,oBAAC,UAAD;IACE,oBAAkB;IAClB,gBAAc,UAAU,OAAO;IAC3B;IACJ,GAAI;IACJ;GACF,oBAAC,OAAD;IAAK,WAAU;cACZ,UAAU,oBAAC,WAAD;KAAmB;KAAQ,IAAI;KAAW,IAAG;IACpD;GACF"}

package/dist/esm/components/InlineAuthLinkBanner.d.ts

@@ -0,0 +1,18 @@
+//#region src/components/InlineAuthLinkBanner.d.ts
+interface InlineAuthLinkBannerProps {
+  className?: string;
+  label: string;
+  linkClassName?: string;
+  linkLabel?: string;
+  to: string;
+}
+declare function InlineAuthLinkBanner({
+  className,
+  label,
+  linkClassName,
+  linkLabel,
+  to
+}: InlineAuthLinkBannerProps): any;
+//#endregion
+export { InlineAuthLinkBanner };
+//# sourceMappingURL=InlineAuthLinkBanner.d.ts.map

package/dist/esm/components/InlineAuthLinkBanner.js

@@ -0,0 +1,23 @@
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { Link } from "react-router";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/InlineAuthLinkBanner.tsx
+function InlineAuthLinkBanner({ className, label, linkClassName, linkLabel, to }) {
+	return /* @__PURE__ */ jsxs("p", {
+		className: cn("text-foreground bg-secondary flex w-fit items-center gap-2 rounded-lg p-3 text-left text-sm", className),
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "text-foreground/80 whitespace-nowrap",
+			children: label
+		}), /* @__PURE__ */ jsx(Link, {
+			className: cn("text-foreground mx-auto whitespace-nowrap hover:underline hover:underline-offset-4", linkClassName),
+			to,
+			children: linkLabel ?? "Login here →"
+		})]
+	});
+}
+
+//#endregion
+export { InlineAuthLinkBanner };
+//# sourceMappingURL=InlineAuthLinkBanner.js.map

package/dist/esm/components/InlineAuthLinkBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineAuthLinkBanner.js","names":[],"sources":["../../../src/components/InlineAuthLinkBanner.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\nimport { Link } from \"react-router\";\n\ninterface InlineAuthLinkBannerProps {\n  className?: string;\n  label: string;\n  linkClassName?: string;\n  linkLabel?: string;\n  to: string;\n}\n\nfunction InlineAuthLinkBanner({\n  className,\n  label,\n  linkClassName,\n  linkLabel,\n  to,\n}: InlineAuthLinkBannerProps) {\n  return (\n    <p\n      className={cn(\n        \"text-foreground bg-secondary flex w-fit items-center gap-2 rounded-lg p-3 text-left text-sm\",\n        className,\n      )}>\n      <span className=\"text-foreground/80 whitespace-nowrap\">{label}</span>\n      <Link\n        className={cn(\n          \"text-foreground mx-auto whitespace-nowrap hover:underline hover:underline-offset-4\",\n          linkClassName,\n        )}\n        to={to}>\n        {linkLabel ?? \"Login here →\"}\n      </Link>\n    </p>\n  );\n}\n\nexport { InlineAuthLinkBanner };\n"],"mappings":";;;;;;AAYA,SAAS,qBAAqB,EAC5B,WACA,OACA,eACA,WACA,MAC4B;AAC5B,QACE,qBAAC,KAAD;EACE,WAAW,GACT,+FACA,UACD;YAJH,CAKE,oBAAC,QAAD;GAAM,WAAU;aAAwC;GAAa,GACrE,oBAAC,MAAD;GACE,WAAW,GACT,sFACA,cACD;GACG;aACH,aAAa;GACT,EACL"}

package/dist/esm/components/KeyboardShortcutDialog.d.ts

@@ -0,0 +1,12 @@
+import { FunctionComponent } from "react";
+
+//#region src/components/KeyboardShortcutDialog.d.ts
+interface KeyboardShortcutDialogProps {
+  onOpenChange: (open: boolean) => void;
+  open: boolean;
+  shortcuts: Record<string, string | string[]>;
+}
+declare const KeyboardShortcutDialog: FunctionComponent<KeyboardShortcutDialogProps>;
+//#endregion
+export { KeyboardShortcutDialog };
+//# sourceMappingURL=KeyboardShortcutDialog.d.ts.map

package/dist/esm/components/KeyboardShortcutDialog.js

@@ -0,0 +1,48 @@
+import { Badge, Button, Dialog, DialogContent, DialogHeader, DialogTitle } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+
+//#region src/components/KeyboardShortcutDialog.tsx
+const KeyboardShortcutDialog = ({ onOpenChange, open, shortcuts }) => {
+	return /* @__PURE__ */ jsx(Dialog, {
+		onOpenChange,
+		open,
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			className: "max-w-md",
+			children: [
+				/* @__PURE__ */ jsx("div", {
+					className: "absolute right-4 top-4",
+					children: /* @__PURE__ */ jsx(Button, {
+						className: "h-8 w-8",
+						onClick: () => onOpenChange(false),
+						size: "icon",
+						variant: "ghost",
+						children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+					})
+				}),
+				/* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Keyboard Shortcuts" }) }),
+				/* @__PURE__ */ jsx("div", {
+					className: "grid gap-2",
+					children: Object.entries(shortcuts).map(([action, keys]) => /* @__PURE__ */ jsxs("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-muted-foreground text-sm",
+							children: action
+						}), /* @__PURE__ */ jsx("div", {
+							className: "flex gap-1",
+							children: (Array.isArray(keys) ? keys : [keys]).map((key) => /* @__PURE__ */ jsx(Badge, {
+								variant: "outline",
+								children: key
+							}, key))
+						})]
+					}, action))
+				})
+			]
+		})
+	});
+};
+
+//#endregion
+export { KeyboardShortcutDialog };
+//# sourceMappingURL=KeyboardShortcutDialog.js.map

package/dist/esm/components/KeyboardShortcutDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyboardShortcutDialog.js","names":[],"sources":["../../../src/components/KeyboardShortcutDialog.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  Dialog,\n  DialogContent,\n  DialogHeader,\n  DialogTitle,\n} from \"@lumeweb/portal-framework-ui-core\";\nimport { X } from \"lucide-react\";\nimport React, { type FunctionComponent } from \"react\";\n\ninterface KeyboardShortcutDialogProps {\n  onOpenChange: (open: boolean) => void;\n  open: boolean;\n  shortcuts: Record<string, string | string[]>;\n}\n\nexport const KeyboardShortcutDialog: FunctionComponent<\n  KeyboardShortcutDialogProps\n> = ({ onOpenChange, open, shortcuts }) => {\n  return (\n    <Dialog onOpenChange={onOpenChange} open={open}>\n      <DialogContent className=\"max-w-md\">\n        <div className=\"absolute right-4 top-4\">\n          <Button\n            className=\"h-8 w-8\"\n            onClick={() => onOpenChange(false)}\n            size=\"icon\"\n            variant=\"ghost\">\n            <X className=\"h-4 w-4\" />\n          </Button>\n        </div>\n        <DialogHeader>\n          <DialogTitle>Keyboard Shortcuts</DialogTitle>\n        </DialogHeader>\n        <div className=\"grid gap-2\">\n          {Object.entries(shortcuts).map(([action, keys]) => (\n            <div className=\"flex items-center justify-between\" key={action}>\n              <span className=\"text-muted-foreground text-sm\">{action}</span>\n              <div className=\"flex gap-1\">\n                {(Array.isArray(keys) ? keys : [keys]).map((key) => (\n                  <Badge key={key} variant=\"outline\">\n                    {key}\n                  </Badge>\n                ))}\n              </div>\n            </div>\n          ))}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n};\n"],"mappings":";;;;;;AAiBA,MAAa,0BAER,EAAE,cAAc,MAAM,gBAAgB;AACzC,QACE,oBAAC,QAAD;EAAsB;EAAoB;YACxC,qBAAC,eAAD;GAAe,WAAU;aAAzB;IACE,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,QAAD;MACE,WAAU;MACV,eAAe,aAAa,MAAM;MAClC,MAAK;MACL,SAAQ;gBACR,oBAAC,GAAD,EAAG,WAAU,WAAY;MAClB;KACL;IACN,oBAAC,cAAD,YACE,oBAAC,aAAD,YAAa,sBAAgC,GAChC;IACf,oBAAC,OAAD;KAAK,WAAU;eACZ,OAAO,QAAQ,UAAU,CAAC,KAAK,CAAC,QAAQ,UACvC,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,oBAAC,QAAD;OAAM,WAAU;iBAAiC;OAAc,GAC/D,oBAAC,OAAD;OAAK,WAAU;kBACX,MAAM,QAAQ,KAAK,GAAG,OAAO,CAAC,KAAK,EAAE,KAAK,QAC1C,oBAAC,OAAD;QAAiB,SAAQ;kBACtB;QACK,EAFI,IAEJ,CACR;OACE,EACF;QATkD,OASlD,CACN;KACE;IACQ;;EACT"}

package/dist/esm/components/Loading.d.ts

@@ -0,0 +1,13 @@
+import { HTMLAttributes, ReactNode } from "react";
+
+//#region src/components/Loading.d.ts
+declare function Loading({
+  children,
+  className,
+  ...rest
+}: HTMLAttributes<HTMLDivElement> & {
+  children?: ReactNode;
+}): JSX.Element;
+//#endregion
+export { Loading };
+//# sourceMappingURL=Loading.d.ts.map

package/dist/esm/components/Loading.js

@@ -0,0 +1,38 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/Loading.tsx
+function Loading({ children, className, ...rest }) {
+	return /* @__PURE__ */ jsx("div", {
+		...rest,
+		"aria-busy": "true",
+		className: `bg-background fixed inset-0 z-50 transition-opacity duration-300 ${className ?? ""}`,
+		role: "status",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex min-h-screen flex-col items-center justify-center p-8",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "mb-8",
+				children: /* @__PURE__ */ jsx("div", {
+					className: "bg-primary flex h-16 w-16 items-center justify-center rounded-2xl",
+					children: /* @__PURE__ */ jsx("svg", {
+						"aria-hidden": "true",
+						className: "text-primary-foreground h-8 w-8 motion-safe:animate-spin motion-reduce:animate-none",
+						fill: "currentColor",
+						focusable: "false",
+						viewBox: "0 0 24 24",
+						children: /* @__PURE__ */ jsx("path", { d: "M12 15.5A3.5 3.5 0 0 1 8.5 12A3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.25.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66Z" })
+					})
+				})
+			}), /* @__PURE__ */ jsx("div", {
+				className: "text-center",
+				children: children ?? /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground",
+					children: "Loading page..."
+				})
+			})]
+		})
+	});
+}
+
+//#endregion
+export { Loading };
+//# sourceMappingURL=Loading.js.map

package/dist/esm/components/Loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.js","names":[],"sources":["../../../src/components/Loading.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\n\nfunction Loading({\n  children,\n  className,\n  ...rest\n}: HTMLAttributes<HTMLDivElement> & { children?: ReactNode }): JSX.Element {\n  return (\n    <div\n      {...rest}\n      aria-busy=\"true\"\n      className={`bg-background fixed inset-0 z-50 transition-opacity duration-300 ${className ?? \"\"}`}\n      role=\"status\">\n      <div className=\"flex min-h-screen flex-col items-center justify-center p-8\">\n        {/* App Logo/Icon */}\n        <div className=\"mb-8\">\n          <div className=\"bg-primary flex h-16 w-16 items-center justify-center rounded-2xl\">\n            <svg\n              aria-hidden=\"true\"\n              className=\"text-primary-foreground h-8 w-8 motion-safe:animate-spin motion-reduce:animate-none\"\n              fill=\"currentColor\"\n              focusable=\"false\"\n              viewBox=\"0 0 24 24\">\n              <path d=\"M12 15.5A3.5 3.5 0 0 1 8.5 12A3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.25.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66Z\" />\n            </svg>\n          </div>\n        </div>\n\n        {/* Loading Message */}\n        <div className=\"text-center\">\n          {children ?? <p className=\"text-muted-foreground\">Loading page...</p>}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport { Loading };\n"],"mappings":";;;AAEA,SAAS,QAAQ,EACf,UACA,WACA,GAAG,QACsE;AACzE,QACE,oBAAC,OAAD;EACE,GAAI;EACJ,aAAU;EACV,WAAW,oEAAoE,aAAa;EAC5F,MAAK;YACL,qBAAC,OAAD;GAAK,WAAU;aAAf,CAEE,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,OAAD;MACE,eAAY;MACZ,WAAU;MACV,MAAK;MACL,WAAU;MACV,SAAQ;gBACR,oBAAC,QAAD,EAAM,GAAE,irBAAkrB;MACtrB;KACF;IACF,GAGN,oBAAC,OAAD;IAAK,WAAU;cACZ,YAAY,oBAAC,KAAD;KAAG,WAAU;eAAwB;KAAmB;IACjE,EACF;;EACF"}

package/dist/esm/components/LumeLogo.d.ts

@@ -0,0 +1,12 @@
+//#region src/components/LumeLogo.d.ts
+interface LumeLogoProps {
+  className?: string;
+  imageClassName?: string;
+}
+declare function LumeLogo({
+  className,
+  imageClassName
+}: LumeLogoProps): any;
+//#endregion
+export { LumeLogo };
+//# sourceMappingURL=LumeLogo.d.ts.map

package/dist/esm/components/LumeLogo.js

@@ -0,0 +1,22 @@
+import { logoPng } from "../images.js";
+import { cn } from "@lumeweb/portal-framework-ui-core";
+import React from "react";
+import { Link } from "react-router";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/LumeLogo.tsx
+function LumeLogo({ className, imageClassName }) {
+	return /* @__PURE__ */ jsx(Link, {
+		className: cn("flex items-center space-x-2", className),
+		to: "/",
+		children: /* @__PURE__ */ jsx("img", {
+			alt: "Lume logo",
+			className: cn("h-10", imageClassName),
+			src: logoPng
+		})
+	});
+}
+
+//#endregion
+export { LumeLogo };
+//# sourceMappingURL=LumeLogo.js.map

package/dist/esm/components/LumeLogo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LumeLogo.js","names":[],"sources":["../../../src/components/LumeLogo.tsx"],"sourcesContent":["import { cn } from \"@lumeweb/portal-framework-ui-core\";\nimport React from \"react\";\nimport { Link } from \"react-router\";\n\n// @ts-ignore\nimport { logoPng } from \"@/images\";\n\ninterface LumeLogoProps {\n  className?: string;\n  imageClassName?: string;\n}\n\nexport function LumeLogo({ className, imageClassName }: LumeLogoProps) {\n  return (\n    <Link className={cn(\"flex items-center space-x-2\", className)} to=\"/\">\n      <img\n        alt=\"Lume logo\"\n        className={cn(\"h-10\", imageClassName)}\n        src={logoPng}\n      />\n    </Link>\n  );\n}\n"],"mappings":";;;;;;;AAYA,SAAgB,SAAS,EAAE,WAAW,kBAAiC;AACrE,QACE,oBAAC,MAAD;EAAM,WAAW,GAAG,+BAA+B,UAAU;EAAE,IAAG;YAChE,oBAAC,OAAD;GACE,KAAI;GACJ,WAAW,GAAG,QAAQ,eAAe;GACrC,KAAK;GACL;EACG"}