@intlayer/design-system 8.1.1 → 8.1.3-canary.0

package/dist/esm/components/Browser/Browser.mjs

@@ -1,250 +1,2 @@
-'use client';
-
-import { cn } from "../../utils/cn.mjs";
-import { Button } from "../Button/Button.mjs";
-import { Input, inputVariants } from "../Input/Input.mjs";
-import { useEffect, useImperativeHandle, useRef, useState } from "react";
-import { ArrowLeft, ArrowRight, RotateCw } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useIntlayer } from "react-intlayer";
-
-//#region src/components/Browser/Browser.tsx
-const Browser = ({ initialUrl = "https://example.com", path, className, style, size = "md", "aria-label": ariaLabel, sandbox = "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads", ref, domainRestriction, ...props }) => {
-	const [inputUrl, setInputUrl] = useState(initialUrl);
-	const [currentUrl, setCurrentUrl] = useState(initialUrl);
-	const [history, setHistory] = useState([initialUrl]);
-	const [currentIndex, setCurrentIndex] = useState(0);
-	const [error, setError] = useState(null);
-	const [submitted, setSubmitted] = useState(false);
-	const internalIframeRef = useRef(null);
-	useImperativeHandle(ref, () => internalIframeRef.current, []);
-	const content = useIntlayer("browser");
-	useEffect(() => {
-		setInputUrl(initialUrl);
-		setCurrentUrl(initialUrl);
-		setHistory([initialUrl]);
-		setCurrentIndex(0);
-		setError(null);
-		setSubmitted(false);
-	}, [initialUrl]);
-	useEffect(() => {
-		if (!path) return;
-		try {
-			const baseOrigin = domainRestriction ?? initialUrl;
-			const fullUrl = `${new URL(baseOrigin).origin}${path}`;
-			setInputUrl(fullUrl);
-			let isAlreadyAtUrl = false;
-			if (internalIframeRef.current?.contentWindow) try {
-				const currentIframeHref = internalIframeRef.current.contentWindow.location.href;
-				if (new URL(currentIframeHref).href === new URL(fullUrl).href) isAlreadyAtUrl = true;
-			} catch {}
-			if (history[currentIndex] !== fullUrl) {
-				setHistory((prev) => {
-					const newHistory = prev.slice(0, currentIndex + 1);
-					newHistory.push(fullUrl);
-					return newHistory;
-				});
-				setCurrentIndex((prev) => prev + 1);
-			}
-			if (!isAlreadyAtUrl) setCurrentUrl(fullUrl);
-			setError(null);
-		} catch {}
-	}, [
-		path,
-		domainRestriction,
-		initialUrl
-	]);
-	const handleNavigateTo = (url) => {
-		try {
-			const validated = normalizeUrl(url);
-			if (validated === currentUrl) {
-				handleReload();
-				return;
-			}
-			setCurrentUrl(validated);
-			setInputUrl(validated);
-			setError(null);
-			const newHistory = history.slice(0, currentIndex + 1);
-			newHistory.push(validated);
-			setHistory(newHistory);
-			setCurrentIndex(newHistory.length - 1);
-		} catch (e) {
-			if (e instanceof Error && e.message === "URL does not match allowed domain" && domainRestriction) setError(content.domainRestrictionError?.value ?? `Only URLs from ${domainRestriction} are allowed.`);
-			else setError(content.errorMessage.value);
-		}
-	};
-	const handleBack = () => {
-		if (currentIndex > 0) {
-			const newIndex = currentIndex - 1;
-			const prevUrl = history[newIndex];
-			setCurrentIndex(newIndex);
-			setCurrentUrl(prevUrl);
-			setInputUrl(prevUrl);
-			setError(null);
-		}
-	};
-	const handleForward = () => {
-		if (currentIndex < history.length - 1) {
-			const newIndex = currentIndex + 1;
-			const nextUrl = history[newIndex];
-			setCurrentIndex(newIndex);
-			setCurrentUrl(nextUrl);
-			setInputUrl(nextUrl);
-			setError(null);
-		}
-	};
-	const handleSubmit = (e) => {
-		e.preventDefault();
-		setSubmitted(true);
-		handleNavigateTo(inputUrl);
-	};
-	const handleReload = () => {
-		if (internalIframeRef.current) {
-			const src = internalIframeRef.current.src;
-			internalIframeRef.current.src = "";
-			setTimeout(() => {
-				if (internalIframeRef.current) internalIframeRef.current.src = src;
-			}, 50);
-		}
-	};
-	const isValidHostname = (host) => {
-		if (host === "localhost") return true;
-		if (/^(\d{1,3}\.){3}\d{1,3}$/.test(host)) return true;
-		if (/^[a-f0-9:]+$/i.test(host)) return true;
-		if (!/^[a-z0-9.-]+$/i.test(host)) return false;
-		if (/^[-.]/.test(host) || /[-.]$/.test(host)) return false;
-		if (host.includes("..")) return false;
-		if (!host.includes(".")) return false;
-		return true;
-	};
-	const getRestrictionOrigin = () => {
-		if (!domainRestriction) return null;
-		try {
-			return new URL(domainRestriction);
-		} catch {
-			return null;
-		}
-	};
-	const normalizeUrl = (raw) => {
-		const trimmed = raw.trim();
-		if (!trimmed || /\s/.test(trimmed)) throw new Error("Invalid");
-		const restrictionOrigin = getRestrictionOrigin();
-		if (trimmed.startsWith("/") && !trimmed.startsWith("//")) {
-			if (restrictionOrigin) return new URL(`${restrictionOrigin.origin}${trimmed}`).toString();
-			return new URL(`${new URL(currentUrl).origin}${trimmed}`).toString();
-		}
-		const candidate = /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(trimmed) ? trimmed : `https://${trimmed}`;
-		const url = new URL(candidate);
-		if (url.protocol !== "http:" && url.protocol !== "https:") throw new Error("Only http(s) is allowed");
-		if (!isValidHostname(url.hostname)) throw new Error("Invalid host");
-		if (restrictionOrigin) {
-			if (!(url.hostname === restrictionOrigin.hostname && url.protocol === restrictionOrigin.protocol && (restrictionOrigin.port === "" || url.port === restrictionOrigin.port || url.host === restrictionOrigin.host))) throw new Error("URL does not match allowed domain");
-		}
-		return url.toString();
-	};
-	const showError = submitted && !!error;
-	const canGoBack = currentIndex > 0;
-	const canGoForward = currentIndex < history.length - 1;
-	return /* @__PURE__ */ jsxs("section", {
-		className: cn("flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]", className),
-		style,
-		"aria-label": ariaLabel ?? content.ariaLabel.value,
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: "relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2",
-			children: [
-				/* @__PURE__ */ jsxs("div", {
-					className: "flex items-center gap-1",
-					children: [/* @__PURE__ */ jsx(Button, {
-						type: "button",
-						onClick: handleBack,
-						disabled: !canGoBack,
-						variant: "hoverable",
-						size: "icon-md",
-						label: content.backButtonLabel.value,
-						Icon: ArrowLeft
-					}), /* @__PURE__ */ jsx(Button, {
-						type: "button",
-						onClick: handleForward,
-						disabled: !canGoForward,
-						variant: "hoverable",
-						size: "icon-md",
-						label: content.forwardButtonLabel.value,
-						Icon: ArrowRight
-					})]
-				}),
-				/* @__PURE__ */ jsxs("form", {
-					onSubmit: handleSubmit,
-					noValidate: true,
-					className: cn(inputVariants(), "flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl", "bg-neutral/10 text-text/50 placeholder:text-neutral/80"),
-					children: [
-						/* @__PURE__ */ jsx("label", {
-							htmlFor: "browser-url",
-							className: "sr-only",
-							children: content.urlLabel.value
-						}),
-						/* @__PURE__ */ jsx(Input, {
-							id: "browser-url",
-							type: "text",
-							inputMode: "url",
-							spellCheck: false,
-							autoCapitalize: "off",
-							variant: "invisible",
-							className: "ml-3 p-0!",
-							size: "sm",
-							autoCorrect: "off",
-							value: inputUrl,
-							onChange: (e) => {
-								setInputUrl(e.target.value);
-								if (showError) setError(null);
-							},
-							placeholder: content.urlPlaceholder.value,
-							"aria-label": content.urlLabel.value,
-							"aria-invalid": showError,
-							"aria-describedby": showError ? "browser-url-error" : void 0
-						}),
-						/* @__PURE__ */ jsx(Button, {
-							type: "button",
-							onClick: handleReload,
-							variant: "hoverable",
-							size: "icon-md",
-							className: "p-1!",
-							label: "content.reloadButtonTitle.value",
-							Icon: RotateCw
-						}),
-						/* @__PURE__ */ jsx("button", {
-							type: "submit",
-							className: "sr-only absolute",
-							tabIndex: -1
-						})
-					]
-				}),
-				showError && /* @__PURE__ */ jsx("div", {
-					className: "absolute top-full left-4 z-20 mt-1",
-					children: /* @__PURE__ */ jsx("p", {
-						id: "browser-url-error",
-						role: "alert",
-						"aria-live": "assertive",
-						className: "rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm",
-						children: error
-					})
-				})
-			]
-		}), /* @__PURE__ */ jsx("div", {
-			className: "relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background",
-			children: /* @__PURE__ */ jsx("iframe", {
-				ref: internalIframeRef,
-				src: currentUrl,
-				title: content.iframeTitle.value,
-				className: "size-full flex-1",
-				sandbox,
-				loading: "lazy",
-				"aria-live": "polite",
-				...props
-			})
-		})]
-	});
-};
-
-//#endregion
-export { Browser };
+"use client";import{cn as e}from"../../utils/cn.mjs";import{Button as t}from"../Button/Button.mjs";import{Input as n,inputVariants as r}from"../Input/Input.mjs";import{ArrowLeft as i,ArrowRight as a,RotateCw as o}from"lucide-react";import{useEffect as s,useImperativeHandle as c,useRef as l,useState as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useIntlayer as p}from"react-intlayer";const m=({initialUrl:m=`https://example.com`,path:h,className:g,style:_,size:v=`md`,"aria-label":y,sandbox:b=`allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads`,ref:x,domainRestriction:S,...C})=>{let[w,T]=u(m),[E,D]=u(m),[O,k]=u([m]),[A,j]=u(0),[M,N]=u(null),[P,F]=u(!1),I=l(null);c(x,()=>I.current,[]);let L=p(`browser`);s(()=>{T(m),D(m),k([m]),j(0),N(null),F(!1)},[m]),s(()=>{if(h)try{let e=S??m,t=`${new URL(e).origin}${h}`;T(t);let n=!1;if(I.current?.contentWindow)try{let e=I.current.contentWindow.location.href;new URL(e).href===new URL(t).href&&(n=!0)}catch{}O[A]!==t&&(k(e=>{let n=e.slice(0,A+1);return n.push(t),n}),j(e=>e+1)),n||D(t),N(null)}catch{}},[h,S,m]);let R=e=>{try{let t=G(e);if(t===E){H();return}D(t),T(t),N(null);let n=O.slice(0,A+1);n.push(t),k(n),j(n.length-1)}catch(e){e instanceof Error&&e.message===`URL does not match allowed domain`&&S?N(L.domainRestrictionError?.value??`Only URLs from ${S} are allowed.`):N(L.errorMessage.value)}},z=()=>{if(A>0){let e=A-1,t=O[e];j(e),D(t),T(t),N(null)}},B=()=>{if(A<O.length-1){let e=A+1,t=O[e];j(e),D(t),T(t),N(null)}},V=e=>{e.preventDefault(),F(!0),R(w)},H=()=>{if(I.current){let e=I.current.src;I.current.src=``,setTimeout(()=>{I.current&&(I.current.src=e)},50)}},U=e=>e===`localhost`||/^(\d{1,3}\.){3}\d{1,3}$/.test(e)||/^[a-f0-9:]+$/i.test(e)?!0:!(!/^[a-z0-9.-]+$/i.test(e)||/^[-.]/.test(e)||/[-.]$/.test(e)||e.includes(`..`)||!e.includes(`.`)),W=()=>{if(!S)return null;try{return new URL(S)}catch{return null}},G=e=>{let t=e.trim();if(!t||/\s/.test(t))throw Error(`Invalid`);let n=W();if(t.startsWith(`/`)&&!t.startsWith(`//`))return n?new URL(`${n.origin}${t}`).toString():new URL(`${new URL(E).origin}${t}`).toString();let r=/^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(t)?t:`https://${t}`,i=new URL(r);if(i.protocol!==`http:`&&i.protocol!==`https:`)throw Error(`Only http(s) is allowed`);if(!U(i.hostname))throw Error(`Invalid host`);if(n&&!(i.hostname===n.hostname&&i.protocol===n.protocol&&(n.port===``||i.port===n.port||i.host===n.host)))throw Error(`URL does not match allowed domain`);return i.toString()},K=P&&!!M,q=A>0,J=A<O.length-1;return f(`section`,{className:e(`flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]`,g),style:_,"aria-label":y??L.ariaLabel.value,children:[f(`div`,{className:`relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2`,children:[f(`div`,{className:`flex items-center gap-1`,children:[d(t,{type:`button`,onClick:z,disabled:!q,variant:`hoverable`,size:`icon-md`,label:L.backButtonLabel.value,Icon:i}),d(t,{type:`button`,onClick:B,disabled:!J,variant:`hoverable`,size:`icon-md`,label:L.forwardButtonLabel.value,Icon:a})]}),f(`form`,{onSubmit:V,noValidate:!0,className:e(r(),`flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl`,`bg-neutral/10 text-text/50 placeholder:text-neutral/80`),children:[d(`label`,{htmlFor:`browser-url`,className:`sr-only`,children:L.urlLabel.value}),d(n,{id:`browser-url`,type:`text`,inputMode:`url`,spellCheck:!1,autoCapitalize:`off`,variant:`invisible`,className:`ml-3 p-0!`,size:`sm`,autoCorrect:`off`,value:w,onChange:e=>{T(e.target.value),K&&N(null)},placeholder:L.urlPlaceholder.value,"aria-label":L.urlLabel.value,"aria-invalid":K,"aria-describedby":K?`browser-url-error`:void 0}),d(t,{type:`button`,onClick:H,variant:`hoverable`,size:`icon-md`,className:`p-1!`,label:`content.reloadButtonTitle.value`,Icon:o}),d(`button`,{type:`submit`,className:`sr-only absolute`,tabIndex:-1})]}),K&&d(`div`,{className:`absolute top-full left-4 z-20 mt-1`,children:d(`p`,{id:`browser-url-error`,role:`alert`,"aria-live":`assertive`,className:`rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm`,children:M})})]}),d(`div`,{className:`relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background`,children:d(`iframe`,{ref:I,src:E,title:L.iframeTitle.value,className:`size-full flex-1`,sandbox:b,loading:`lazy`,"aria-live":`polite`,...C})})]})};export{m as Browser};
 //# sourceMappingURL=Browser.mjs.map

package/dist/esm/components/Browser/Browser.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Browser.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ArrowLeft, ArrowRight, RotateCw } from 'lucide-react';\nimport {\n  type CSSProperties,\n  type FormEvent,\n  type HTMLAttributes,\n  type RefObject,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button } from '../Button';\nimport { Input, inputVariants } from '../Input';\n\nexport type BrowserProps = {\n  initialUrl?: string;\n  path?: string;\n  className?: string;\n  style?: CSSProperties;\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  'aria-label'?: string;\n  sandbox?: string;\n  ref?: RefObject<HTMLIFrameElement | null>;\n  domainRestriction?: string;\n} & HTMLAttributes<HTMLIFrameElement>;\n\nexport const Browser = ({\n  initialUrl = 'https://example.com',\n  path,\n  className,\n  style,\n  size = 'md',\n  'aria-label': ariaLabel,\n  sandbox = 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads',\n  ref,\n  domainRestriction,\n  ...props\n}: BrowserProps) => {\n  // --- State -----------------------------------------------------------------\n  const [inputUrl, setInputUrl] = useState(initialUrl);\n  const [currentUrl, setCurrentUrl] = useState(initialUrl);\n\n  // History Management\n  const [history, setHistory] = useState<string[]>([initialUrl]);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const [error, setError] = useState<string | null>(null);\n  const [submitted, setSubmitted] = useState(false);\n  const internalIframeRef = useRef<HTMLIFrameElement>(null);\n\n  useImperativeHandle(ref, () => internalIframeRef.current!, []);\n  const content = useIntlayer('browser');\n\n  // --- Effects ---------------------------------------------------------------\n\n  // Reset everything if initialUrl changes completely\n  useEffect(() => {\n    setInputUrl(initialUrl);\n    setCurrentUrl(initialUrl);\n    setHistory([initialUrl]);\n    setCurrentIndex(0);\n    setError(null);\n    setSubmitted(false);\n  }, [initialUrl]);\n\n  // Sync external path changes with the URL bar and History\n  useEffect(() => {\n    if (!path) return;\n\n    try {\n      const baseOrigin = domainRestriction ?? initialUrl;\n      const origin = new URL(baseOrigin).origin;\n      const fullUrl = `${origin}${path}`;\n\n      // Update Input (Always update the visual bar)\n      setInputUrl(fullUrl);\n\n      // Check internal iframe state to avoid reload if already there\n      let isAlreadyAtUrl = false;\n      if (internalIframeRef.current?.contentWindow) {\n        try {\n          const currentIframeHref =\n            internalIframeRef.current.contentWindow.location.href;\n          if (new URL(currentIframeHref).href === new URL(fullUrl).href) {\n            isAlreadyAtUrl = true;\n          }\n        } catch {\n          // Cross-origin access ignored\n        }\n      }\n\n      // Update History Stack\n      // We perform this check regardless of `isAlreadyAtUrl`.\n      // If the path changed (even internally), we want to record it in the arrow stack.\n      if (history[currentIndex] !== fullUrl) {\n        setHistory((prev) => {\n          const newHistory = prev.slice(0, currentIndex + 1);\n          newHistory.push(fullUrl);\n          return newHistory;\n        });\n        setCurrentIndex((prev) => prev + 1);\n      }\n\n      // Navigate (Update src) only if NOT already there\n      // This prevents the iframe from refreshing when the user navigated inside it.\n      if (!isAlreadyAtUrl) {\n        setCurrentUrl(fullUrl);\n      }\n\n      setError(null);\n    } catch {\n      // Ignore invalid paths\n    }\n  }, [path, domainRestriction, initialUrl]); // Removed currentIndex dependency to prevent loops\n\n  // --- Navigation Logic ------------------------------------------------------\n\n  const handleNavigateTo = (url: string) => {\n    try {\n      const validated = normalizeUrl(url);\n\n      // If we are navigating to the exact same URL, just reload\n      if (validated === currentUrl) {\n        handleReload();\n        return;\n      }\n\n      setCurrentUrl(validated);\n      setInputUrl(validated);\n      setError(null);\n\n      // Update History: Slice future if we went back, then push new\n      const newHistory = history.slice(0, currentIndex + 1);\n      newHistory.push(validated);\n      setHistory(newHistory);\n      setCurrentIndex(newHistory.length - 1);\n    } catch (e) {\n      if (\n        e instanceof Error &&\n        e.message === 'URL does not match allowed domain' &&\n        domainRestriction\n      ) {\n        setError(\n          content.domainRestrictionError?.value ??\n            `Only URLs from ${domainRestriction} are allowed.`\n        );\n      } else {\n        setError(content.errorMessage.value);\n      }\n    }\n  };\n\n  const handleBack = () => {\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1;\n      const prevUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(prevUrl);\n      setInputUrl(prevUrl);\n      setError(null);\n    }\n  };\n\n  const handleForward = () => {\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1;\n      const nextUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(nextUrl);\n      setInputUrl(nextUrl);\n      setError(null);\n    }\n  };\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setSubmitted(true);\n    handleNavigateTo(inputUrl);\n  };\n\n  const handleReload = () => {\n    if (internalIframeRef.current) {\n      // Create a clean reload effect\n      const src = internalIframeRef.current.src;\n      internalIframeRef.current.src = '';\n      setTimeout(() => {\n        if (internalIframeRef.current) internalIframeRef.current.src = src;\n      }, 50);\n    }\n  };\n\n  // --- Validation Helpers ----------------------------------------------------\n  const isValidHostname = (host: string) => {\n    if (host === 'localhost') return true;\n    if (/^(\\d{1,3}\\.){3}\\d{1,3}$/.test(host)) return true;\n    if (/^[a-f0-9:]+$/i.test(host)) return true;\n    if (!/^[a-z0-9.-]+$/i.test(host)) return false;\n    if (/^[-.]/.test(host) || /[-.]$/.test(host)) return false;\n    if (host.includes('..')) return false;\n    if (!host.includes('.')) return false;\n    return true;\n  };\n\n  const getRestrictionOrigin = (): URL | null => {\n    if (!domainRestriction) return null;\n    try {\n      return new URL(domainRestriction);\n    } catch {\n      return null;\n    }\n  };\n\n  const normalizeUrl = (raw: string) => {\n    const trimmed = raw.trim();\n    if (!trimmed || /\\s/.test(trimmed)) throw new Error('Invalid');\n\n    const restrictionOrigin = getRestrictionOrigin();\n    const isRelativePath = trimmed.startsWith('/') && !trimmed.startsWith('//');\n\n    if (isRelativePath) {\n      if (restrictionOrigin) {\n        return new URL(`${restrictionOrigin.origin}${trimmed}`).toString();\n      }\n      return new URL(`${new URL(currentUrl).origin}${trimmed}`).toString();\n    }\n\n    const hasProtocol = /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(trimmed);\n    const candidate = hasProtocol ? trimmed : `https://${trimmed}`;\n    const url = new URL(candidate);\n\n    if (url.protocol !== 'http:' && url.protocol !== 'https:') {\n      throw new Error('Only http(s) is allowed');\n    }\n\n    if (!isValidHostname(url.hostname)) throw new Error('Invalid host');\n\n    if (restrictionOrigin) {\n      const urlMatches =\n        url.hostname === restrictionOrigin.hostname &&\n        url.protocol === restrictionOrigin.protocol &&\n        (restrictionOrigin.port === '' ||\n          url.port === restrictionOrigin.port ||\n          url.host === restrictionOrigin.host);\n\n      if (!urlMatches) throw new Error('URL does not match allowed domain');\n    }\n\n    return url.toString();\n  };\n\n  const showError = submitted && !!error;\n  const canGoBack = currentIndex > 0;\n  const canGoForward = currentIndex < history.length - 1;\n\n  return (\n    <section\n      className={cn(\n        'flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]',\n        className\n      )}\n      style={style}\n      aria-label={ariaLabel ?? content.ariaLabel.value}\n    >\n      {/* Top bar */}\n      <div className=\"relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2\">\n        {/* Navigation Controls */}\n        <div className=\"flex items-center gap-1\">\n          <Button\n            type=\"button\"\n            onClick={handleBack}\n            disabled={!canGoBack}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.backButtonLabel.value}\n            Icon={ArrowLeft}\n          />\n          <Button\n            type=\"button\"\n            onClick={handleForward}\n            disabled={!canGoForward}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.forwardButtonLabel.value}\n            Icon={ArrowRight}\n          />\n        </div>\n\n        {/* URL Bar */}\n        <form\n          onSubmit={handleSubmit}\n          noValidate\n          className={cn(\n            inputVariants(),\n            'flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl',\n            'bg-neutral/10 text-text/50 placeholder:text-neutral/80'\n          )}\n        >\n          <label htmlFor=\"browser-url\" className=\"sr-only\">\n            {content.urlLabel.value}\n          </label>\n          <Input\n            id=\"browser-url\"\n            type=\"text\"\n            inputMode=\"url\"\n            spellCheck={false}\n            autoCapitalize=\"off\"\n            variant=\"invisible\"\n            className=\"ml-3 p-0!\"\n            size=\"sm\"\n            autoCorrect=\"off\"\n            value={inputUrl}\n            onChange={(e) => {\n              setInputUrl(e.target.value);\n              if (showError) setError(null);\n            }}\n            placeholder={content.urlPlaceholder.value}\n            aria-label={content.urlLabel.value}\n            aria-invalid={showError}\n            aria-describedby={showError ? 'browser-url-error' : undefined}\n          />\n\n          <Button\n            type=\"button\"\n            onClick={handleReload}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            className=\"p-1!\"\n            label={'content.reloadButtonTitle.value'}\n            Icon={RotateCw}\n          />\n\n          {/* invisible submit */}\n          <button type=\"submit\" className=\"sr-only absolute\" tabIndex={-1} />\n        </form>\n\n        {/* Error Message Tooltip */}\n        {showError && (\n          <div className=\"absolute top-full left-4 z-20 mt-1\">\n            <p\n              id=\"browser-url-error\"\n              role=\"alert\"\n              aria-live=\"assertive\"\n              className=\"rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm\"\n            >\n              {error}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Iframe */}\n      <div className=\"relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background\">\n        <iframe\n          ref={internalIframeRef}\n          src={currentUrl}\n          title={content.iframeTitle.value}\n          className=\"size-full flex-1\"\n          sandbox={sandbox}\n          loading=\"lazy\"\n          aria-live=\"polite\"\n          {...props}\n        />\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"Browser.mjs","names":[],"sources":["../../../../src/components/Browser/Browser.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@utils/cn';\nimport { ArrowLeft, ArrowRight, RotateCw } from 'lucide-react';\nimport {\n  type CSSProperties,\n  type FormEvent,\n  type HTMLAttributes,\n  type RefObject,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\nimport { useIntlayer } from 'react-intlayer';\nimport { Button } from '../Button';\nimport { Input, inputVariants } from '../Input';\n\nexport type BrowserProps = {\n  initialUrl?: string;\n  path?: string;\n  className?: string;\n  style?: CSSProperties;\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  'aria-label'?: string;\n  sandbox?: string;\n  ref?: RefObject<HTMLIFrameElement | null>;\n  domainRestriction?: string;\n} & HTMLAttributes<HTMLIFrameElement>;\n\nexport const Browser = ({\n  initialUrl = 'https://example.com',\n  path,\n  className,\n  style,\n  size = 'md',\n  'aria-label': ariaLabel,\n  sandbox = 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-downloads',\n  ref,\n  domainRestriction,\n  ...props\n}: BrowserProps) => {\n  // --- State -----------------------------------------------------------------\n  const [inputUrl, setInputUrl] = useState(initialUrl);\n  const [currentUrl, setCurrentUrl] = useState(initialUrl);\n\n  // History Management\n  const [history, setHistory] = useState<string[]>([initialUrl]);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const [error, setError] = useState<string | null>(null);\n  const [submitted, setSubmitted] = useState(false);\n  const internalIframeRef = useRef<HTMLIFrameElement>(null);\n\n  useImperativeHandle(ref, () => internalIframeRef.current!, []);\n  const content = useIntlayer('browser');\n\n  // --- Effects ---------------------------------------------------------------\n\n  // Reset everything if initialUrl changes completely\n  useEffect(() => {\n    setInputUrl(initialUrl);\n    setCurrentUrl(initialUrl);\n    setHistory([initialUrl]);\n    setCurrentIndex(0);\n    setError(null);\n    setSubmitted(false);\n  }, [initialUrl]);\n\n  // Sync external path changes with the URL bar and History\n  useEffect(() => {\n    if (!path) return;\n\n    try {\n      const baseOrigin = domainRestriction ?? initialUrl;\n      const origin = new URL(baseOrigin).origin;\n      const fullUrl = `${origin}${path}`;\n\n      // Update Input (Always update the visual bar)\n      setInputUrl(fullUrl);\n\n      // Check internal iframe state to avoid reload if already there\n      let isAlreadyAtUrl = false;\n      if (internalIframeRef.current?.contentWindow) {\n        try {\n          const currentIframeHref =\n            internalIframeRef.current.contentWindow.location.href;\n          if (new URL(currentIframeHref).href === new URL(fullUrl).href) {\n            isAlreadyAtUrl = true;\n          }\n        } catch {\n          // Cross-origin access ignored\n        }\n      }\n\n      // Update History Stack\n      // We perform this check regardless of `isAlreadyAtUrl`.\n      // If the path changed (even internally), we want to record it in the arrow stack.\n      if (history[currentIndex] !== fullUrl) {\n        setHistory((prev) => {\n          const newHistory = prev.slice(0, currentIndex + 1);\n          newHistory.push(fullUrl);\n          return newHistory;\n        });\n        setCurrentIndex((prev) => prev + 1);\n      }\n\n      // Navigate (Update src) only if NOT already there\n      // This prevents the iframe from refreshing when the user navigated inside it.\n      if (!isAlreadyAtUrl) {\n        setCurrentUrl(fullUrl);\n      }\n\n      setError(null);\n    } catch {\n      // Ignore invalid paths\n    }\n  }, [path, domainRestriction, initialUrl]); // Removed currentIndex dependency to prevent loops\n\n  // --- Navigation Logic ------------------------------------------------------\n\n  const handleNavigateTo = (url: string) => {\n    try {\n      const validated = normalizeUrl(url);\n\n      // If we are navigating to the exact same URL, just reload\n      if (validated === currentUrl) {\n        handleReload();\n        return;\n      }\n\n      setCurrentUrl(validated);\n      setInputUrl(validated);\n      setError(null);\n\n      // Update History: Slice future if we went back, then push new\n      const newHistory = history.slice(0, currentIndex + 1);\n      newHistory.push(validated);\n      setHistory(newHistory);\n      setCurrentIndex(newHistory.length - 1);\n    } catch (e) {\n      if (\n        e instanceof Error &&\n        e.message === 'URL does not match allowed domain' &&\n        domainRestriction\n      ) {\n        setError(\n          content.domainRestrictionError?.value ??\n            `Only URLs from ${domainRestriction} are allowed.`\n        );\n      } else {\n        setError(content.errorMessage.value);\n      }\n    }\n  };\n\n  const handleBack = () => {\n    if (currentIndex > 0) {\n      const newIndex = currentIndex - 1;\n      const prevUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(prevUrl);\n      setInputUrl(prevUrl);\n      setError(null);\n    }\n  };\n\n  const handleForward = () => {\n    if (currentIndex < history.length - 1) {\n      const newIndex = currentIndex + 1;\n      const nextUrl = history[newIndex];\n      setCurrentIndex(newIndex);\n      setCurrentUrl(nextUrl);\n      setInputUrl(nextUrl);\n      setError(null);\n    }\n  };\n\n  const handleSubmit = (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setSubmitted(true);\n    handleNavigateTo(inputUrl);\n  };\n\n  const handleReload = () => {\n    if (internalIframeRef.current) {\n      // Create a clean reload effect\n      const src = internalIframeRef.current.src;\n      internalIframeRef.current.src = '';\n      setTimeout(() => {\n        if (internalIframeRef.current) internalIframeRef.current.src = src;\n      }, 50);\n    }\n  };\n\n  // --- Validation Helpers ----------------------------------------------------\n  const isValidHostname = (host: string) => {\n    if (host === 'localhost') return true;\n    if (/^(\\d{1,3}\\.){3}\\d{1,3}$/.test(host)) return true;\n    if (/^[a-f0-9:]+$/i.test(host)) return true;\n    if (!/^[a-z0-9.-]+$/i.test(host)) return false;\n    if (/^[-.]/.test(host) || /[-.]$/.test(host)) return false;\n    if (host.includes('..')) return false;\n    if (!host.includes('.')) return false;\n    return true;\n  };\n\n  const getRestrictionOrigin = (): URL | null => {\n    if (!domainRestriction) return null;\n    try {\n      return new URL(domainRestriction);\n    } catch {\n      return null;\n    }\n  };\n\n  const normalizeUrl = (raw: string) => {\n    const trimmed = raw.trim();\n    if (!trimmed || /\\s/.test(trimmed)) throw new Error('Invalid');\n\n    const restrictionOrigin = getRestrictionOrigin();\n    const isRelativePath = trimmed.startsWith('/') && !trimmed.startsWith('//');\n\n    if (isRelativePath) {\n      if (restrictionOrigin) {\n        return new URL(`${restrictionOrigin.origin}${trimmed}`).toString();\n      }\n      return new URL(`${new URL(currentUrl).origin}${trimmed}`).toString();\n    }\n\n    const hasProtocol = /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(trimmed);\n    const candidate = hasProtocol ? trimmed : `https://${trimmed}`;\n    const url = new URL(candidate);\n\n    if (url.protocol !== 'http:' && url.protocol !== 'https:') {\n      throw new Error('Only http(s) is allowed');\n    }\n\n    if (!isValidHostname(url.hostname)) throw new Error('Invalid host');\n\n    if (restrictionOrigin) {\n      const urlMatches =\n        url.hostname === restrictionOrigin.hostname &&\n        url.protocol === restrictionOrigin.protocol &&\n        (restrictionOrigin.port === '' ||\n          url.port === restrictionOrigin.port ||\n          url.host === restrictionOrigin.host);\n\n      if (!urlMatches) throw new Error('URL does not match allowed domain');\n    }\n\n    return url.toString();\n  };\n\n  const showError = submitted && !!error;\n  const canGoBack = currentIndex > 0;\n  const canGoForward = currentIndex < history.length - 1;\n\n  return (\n    <section\n      className={cn(\n        'flex w-full flex-col overflow-hidden rounded-xl bg-background shadow-[0_4px_12px_rgba(0,0,0,0.4),0_0_1px_rgba(0,0,0,0.2)]',\n        className\n      )}\n      style={style}\n      aria-label={ariaLabel ?? content.ariaLabel.value}\n    >\n      {/* Top bar */}\n      <div className=\"relative z-10 flex shrink-0 items-center gap-3 rounded-t-xl bg-text/15 px-4 py-2\">\n        {/* Navigation Controls */}\n        <div className=\"flex items-center gap-1\">\n          <Button\n            type=\"button\"\n            onClick={handleBack}\n            disabled={!canGoBack}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.backButtonLabel.value}\n            Icon={ArrowLeft}\n          />\n          <Button\n            type=\"button\"\n            onClick={handleForward}\n            disabled={!canGoForward}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            label={content.forwardButtonLabel.value}\n            Icon={ArrowRight}\n          />\n        </div>\n\n        {/* URL Bar */}\n        <form\n          onSubmit={handleSubmit}\n          noValidate\n          className={cn(\n            inputVariants(),\n            'flex w-full gap-2 rounded-xl p-0.5! supports-[corner-shape:squircle]:rounded-2xl',\n            'bg-neutral/10 text-text/50 placeholder:text-neutral/80'\n          )}\n        >\n          <label htmlFor=\"browser-url\" className=\"sr-only\">\n            {content.urlLabel.value}\n          </label>\n          <Input\n            id=\"browser-url\"\n            type=\"text\"\n            inputMode=\"url\"\n            spellCheck={false}\n            autoCapitalize=\"off\"\n            variant=\"invisible\"\n            className=\"ml-3 p-0!\"\n            size=\"sm\"\n            autoCorrect=\"off\"\n            value={inputUrl}\n            onChange={(e) => {\n              setInputUrl(e.target.value);\n              if (showError) setError(null);\n            }}\n            placeholder={content.urlPlaceholder.value}\n            aria-label={content.urlLabel.value}\n            aria-invalid={showError}\n            aria-describedby={showError ? 'browser-url-error' : undefined}\n          />\n\n          <Button\n            type=\"button\"\n            onClick={handleReload}\n            variant=\"hoverable\"\n            size=\"icon-md\"\n            className=\"p-1!\"\n            label={'content.reloadButtonTitle.value'}\n            Icon={RotateCw}\n          />\n\n          {/* invisible submit */}\n          <button type=\"submit\" className=\"sr-only absolute\" tabIndex={-1} />\n        </form>\n\n        {/* Error Message Tooltip */}\n        {showError && (\n          <div className=\"absolute top-full left-4 z-20 mt-1\">\n            <p\n              id=\"browser-url-error\"\n              role=\"alert\"\n              aria-live=\"assertive\"\n              className=\"rounded-md bg-red-900/90 px-3 py-1.5 text-red-100 text-xs shadow-md backdrop-blur-sm\"\n            >\n              {error}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Iframe */}\n      <div className=\"relative z-0 flex min-h-0 w-full flex-1 flex-col overflow-hidden rounded-b-xl bg-background\">\n        <iframe\n          ref={internalIframeRef}\n          src={currentUrl}\n          title={content.iframeTitle.value}\n          className=\"size-full flex-1\"\n          sandbox={sandbox}\n          loading=\"lazy\"\n          aria-live=\"polite\"\n          {...props}\n        />\n      </div>\n    </section>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/Browser/index.mjs

@@ -1,3 +1 @@
-import { Browser } from "./Browser.mjs";
-
-export { Browser };
+import{Browser as e}from"./Browser.mjs";export{e as Browser};

package/dist/esm/components/Button/Button.mjs

@@ -1,288 +1,2 @@
-import { cn } from "../../utils/cn.mjs";
-import { ContainerRoundedSize } from "../Container/index.mjs";
-import { Loader } from "../Loader/index.mjs";
-import { cva } from "class-variance-authority";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/Button/Button.tsx
-/**
-* Button size variants for different use cases
-*/
-let ButtonSize = /* @__PURE__ */ function(ButtonSize) {
-	ButtonSize["SM"] = "sm";
-	ButtonSize["MD"] = "md";
-	ButtonSize["LG"] = "lg";
-	ButtonSize["XL"] = "xl";
-	ButtonSize["ICON_SM"] = "icon-sm";
-	ButtonSize["ICON_MD"] = "icon-md";
-	ButtonSize["ICON_LG"] = "icon-lg";
-	ButtonSize["ICON_XL"] = "icon-xl";
-	return ButtonSize;
-}({});
-const buttonIconVariants = cva("flex-none shrink-0", {
-	variants: { size: {
-		[`${ButtonSize.SM}`]: "size-3",
-		[`${ButtonSize.MD}`]: "size-4",
-		[`${ButtonSize.LG}`]: "size-5",
-		[`${ButtonSize.XL}`]: "size-6",
-		[`${ButtonSize.ICON_SM}`]: "size-3",
-		[`${ButtonSize.ICON_MD}`]: "size-4",
-		[`${ButtonSize.ICON_LG}`]: "size-4",
-		[`${ButtonSize.ICON_XL}`]: "size-5"
-	} },
-	defaultVariants: { size: ButtonSize.MD }
-});
-/**
-* Button visual style variants
-*/
-let ButtonVariant = /* @__PURE__ */ function(ButtonVariant) {
-	ButtonVariant["DEFAULT"] = "default";
-	ButtonVariant["NONE"] = "none";
-	ButtonVariant["OUTLINE"] = "outline";
-	ButtonVariant["LINK"] = "link";
-	ButtonVariant["INVISIBLE_LINK"] = "invisible-link";
-	ButtonVariant["HOVERABLE"] = "hoverable";
-	ButtonVariant["FADE"] = "fade";
-	ButtonVariant["INPUT"] = "input";
-	return ButtonVariant;
-}({});
-/**
-* Button color themes that work with the design system
-*/
-let ButtonColor = /* @__PURE__ */ function(ButtonColor) {
-	ButtonColor["PRIMARY"] = "primary";
-	ButtonColor["SECONDARY"] = "secondary";
-	ButtonColor["DESTRUCTIVE"] = "destructive";
-	ButtonColor["NEUTRAL"] = "neutral";
-	ButtonColor["LIGHT"] = "light";
-	ButtonColor["DARK"] = "dark";
-	ButtonColor["TEXT"] = "text";
-	ButtonColor["CARD"] = "card";
-	ButtonColor["TEXT_INVERSE"] = "text-inverse";
-	ButtonColor["CURRENT"] = "current";
-	ButtonColor["ERROR"] = "error";
-	ButtonColor["SUCCESS"] = "success";
-	ButtonColor["CUSTOM"] = "custom";
-	return ButtonColor;
-}({});
-/**
-* Text alignment options for button content
-*/
-let ButtonTextAlign = /* @__PURE__ */ function(ButtonTextAlign) {
-	ButtonTextAlign["LEFT"] = "left";
-	ButtonTextAlign["CENTER"] = "center";
-	ButtonTextAlign["RIGHT"] = "right";
-	return ButtonTextAlign;
-}({});
-/**
-* Enhanced button variants with improved accessibility and focus states
-*/
-const buttonVariants = cva("relative inline-flex cursor-pointer items-center justify-center font-medium ring-0 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50", {
-	variants: {
-		size: {
-			[`${ButtonSize.SM}`]: "min-h-7 px-3 text-xs max-md:py-1",
-			[`${ButtonSize.MD}`]: "min-h-8 px-6 text-sm max-md:py-2",
-			[`${ButtonSize.LG}`]: "min-h-10 px-8 text-lg max-md:py-3",
-			[`${ButtonSize.XL}`]: "min-h-11 px-10 text-xl max-md:py-4",
-			[`${ButtonSize.ICON_SM}`]: "p-1.5",
-			[`${ButtonSize.ICON_MD}`]: "p-1.5",
-			[`${ButtonSize.ICON_LG}`]: "p-2",
-			[`${ButtonSize.ICON_XL}`]: "p-3"
-		},
-		color: {
-			[`${ButtonColor.PRIMARY}`]: "hover-primary-500/20 text-primary ring-primary-500/20 *:text-text-light",
-			[`${ButtonColor.SECONDARY}`]: "hover-secondary-500/20 text-secondary ring-secondary-500/20 *:text-text-light",
-			[`${ButtonColor.DESTRUCTIVE}`]: "hover-destructive-500/20 text-destructive ring-destructive-500/20 *:text-text-light",
-			[`${ButtonColor.NEUTRAL}`]: "text-neutral ring-neutral-500/5 *:text-text-light",
-			[`${ButtonColor.CARD}`]: "hover-card-500/20 text-card ring-card-500/20 *:text-text-light",
-			[`${ButtonColor.LIGHT}`]: "hover-white-500/20 text-white ring-white/20 *:text-text-light",
-			[`${ButtonColor.DARK}`]: "text-neutral-800 ring-text-light/50 *:text-text-light",
-			[`${ButtonColor.TEXT}`]: "text-text ring-text/20 *:text-text-opposite",
-			[`${ButtonColor.CURRENT}`]: "hover-current-500/10 text-current ring-current/10 *:text-text-light",
-			[`${ButtonColor.TEXT_INVERSE}`]: "text-text-opposite ring-text-opposite/20 *:text-text",
-			[`${ButtonColor.ERROR}`]: "hover-error-500/20 text-error ring-error/20 *:text-text-light",
-			[`${ButtonColor.SUCCESS}`]: "hover-success-500/20 text-success ring-success/20 *:text-text-light",
-			[`${ButtonColor.CUSTOM}`]: ""
-		},
-		roundedSize: {
-			[`${ContainerRoundedSize.NONE}`]: "rounded-none",
-			[`${ContainerRoundedSize.SM}`]: "rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl",
-			[`${ContainerRoundedSize.MD}`]: "rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl",
-			[`${ContainerRoundedSize.LG}`]: "rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl",
-			[`${ContainerRoundedSize.XL}`]: "rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl",
-			[`${ContainerRoundedSize["2xl"]}`]: "rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]",
-			[`${ContainerRoundedSize["3xl"]}`]: "rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]",
-			[`${ContainerRoundedSize["4xl"]}`]: "rounded-[3rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[4rem]",
-			[`${ContainerRoundedSize["5xl"]}`]: "rounded-[4rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[5rem]",
-			[`${ContainerRoundedSize.FULL}`]: "rounded-full"
-		},
-		variant: {
-			[`${ButtonVariant.DEFAULT}`]: [
-				"bg-current",
-				"hover:bg-current/90",
-				"hover:ring-5",
-				"aria-selected:ring-5"
-			],
-			[`${ButtonVariant.OUTLINE}`]: [
-				"rounded-2xl border-[1.3px] border-current bg-current/0 *:text-current!",
-				"hover:bg-current/20 focus-visible:bg-current/20",
-				"hover:ring-5 focus-visible:ring-5",
-				"aria-selected:ring-5"
-			],
-			[`${ButtonVariant.NONE}`]: "border-none bg-current/0 text-inherit hover:bg-current/0",
-			[`${ButtonVariant.LINK}`]: "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent hover:underline",
-			[`${ButtonVariant.INVISIBLE_LINK}`]: "h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent",
-			[`${ButtonVariant.HOVERABLE}`]: "rounded-lg border-none bg-current/0 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5",
-			[`${ButtonVariant.FADE}`]: [
-				"rounded-lg border-none bg-current/10 ring-current/5 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5",
-				"hover:ring-5 focus-visible:ring-5",
-				"aria-selected:ring-5"
-			],
-			[`${ButtonVariant.INPUT}`]: [
-				"text-text",
-				"w-full select-text resize-none rounded-2xl text-base shadow-none outline-none supports-[corner-shape:squircle]:rounded-4xl",
-				"transition-shadow duration-100 md:text-sm",
-				"ring-0",
-				"disabled:opacity-50",
-				"text-text",
-				"bg-neutral-50 dark:bg-neutral-950",
-				"ring-neutral-100 dark:ring-neutral-700",
-				"hover:ring-3",
-				"aria-selected:ring-4",
-				"focus-visible:ring-3",
-				"disabled:ring-0",
-				"focus-visible:outline-none",
-				"[box-shadow:none] focus:[box-shadow:none]",
-				"aria-invalid:border-error"
-			]
-		},
-		textAlign: {
-			[`${ButtonTextAlign.LEFT}`]: "justify-start text-left",
-			[`${ButtonTextAlign.CENTER}`]: "justify-center text-center",
-			[`${ButtonTextAlign.RIGHT}`]: "justify-end text-right"
-		},
-		isFullWidth: {
-			true: "w-full",
-			false: ""
-		}
-	},
-	defaultVariants: {
-		variant: `${ButtonVariant.DEFAULT}`,
-		size: `${ButtonSize.MD}`,
-		color: `${ButtonColor.CUSTOM}`,
-		roundedSize: `${ContainerRoundedSize.MD}`,
-		textAlign: `${ButtonTextAlign.CENTER}`,
-		isFullWidth: false
-	}
-});
-/**
-* Button Component - A comprehensive, accessible button component
-*
-* Features:
-* - Full accessibility compliance with ARIA attributes
-* - Multiple variants and sizes for different use cases
-* - Icon support (left and right positioning)
-* - Loading states with spinner
-* - Keyboard navigation support
-* - Focus management with visible indicators
-* - Responsive design adaptations
-*
-* @example
-* ```tsx
-* // Basic button
-* <Button label="Click me">Click me</Button>
-*
-* // Button with icon and loading state
-* <Button
-*   label="Save document"
-*   Icon={SaveIcon}
-*   isLoading={saving}
-*   disabled={!hasChanges}
-* >
-*   Save
-* </Button>
-*
-* // Destructive action button
-* <Button
-*   variant={`${ButtonVariant.OUTLINE}`}
-*   color={ButtonColor.DESTRUCTIVE}
-*   label="Delete item permanently"
-*   aria-describedby="delete-warning"
-* >
-*   Delete
-* </Button>
-* ```
-*/
-const Button = ({ variant, size, color, children, Icon, IconRight, iconClassName, isLoading = false, isActive, isSelected, isFullWidth, roundedSize, textAlign, disabled, label, className, type = "button", "aria-describedby": ariaDescribedBy, "aria-expanded": ariaExpanded, "aria-haspopup": ariaHasPopup, "aria-pressed": ariaPressed, ...props }) => {
-	const isLink = variant === `${ButtonVariant.LINK}` || variant === `${ButtonVariant.INVISIBLE_LINK}`;
-	const isIconOnly = !children && (Icon || IconRight);
-	const accessibilityProps = {
-		"aria-label": isIconOnly ? label ?? void 0 : void 0,
-		"aria-labelledby": !isIconOnly ? void 0 : void 0,
-		"aria-describedby": ariaDescribedBy,
-		"aria-expanded": ariaExpanded,
-		"aria-haspopup": ariaHasPopup,
-		"aria-pressed": isActive !== void 0 ? isActive : ariaPressed,
-		"aria-busy": isLoading,
-		"aria-current": isActive ? "page" : void 0,
-		"aria-disabled": disabled || isLoading,
-		"aria-selected": isSelected
-	};
-	const isSquareButton = size === ButtonSize.ICON_SM || size === ButtonSize.ICON_MD || size === ButtonSize.ICON_LG || size === ButtonSize.ICON_XL;
-	return /* @__PURE__ */ jsxs("button", {
-		disabled: isLoading || disabled,
-		role: isLink ? "link" : "button",
-		type,
-		className: buttonVariants({
-			variant,
-			size,
-			color,
-			isFullWidth,
-			roundedSize,
-			textAlign: textAlign ?? (IconRight ? ButtonTextAlign.LEFT : ButtonTextAlign.CENTER),
-			className
-		}),
-		...accessibilityProps,
-		...props,
-		children: [
-			Icon && !isLoading && /* @__PURE__ */ jsx(Icon, {
-				className: buttonIconVariants({
-					size,
-					className: cn(!isSquareButton && "mr-3", iconClassName)
-				}),
-				"aria-hidden": "true"
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: cn("flex items-center justify-center transition-[width] duration-300", isLoading && size === ButtonSize.SM && "w-3", isLoading && size === ButtonSize.MD && "w-4", isLoading && size === ButtonSize.LG && "w-5", isLoading && size === ButtonSize.XL && "w-6"),
-				children: /* @__PURE__ */ jsx(Loader, {
-					className: buttonIconVariants({
-						size,
-						className: cn(!isSquareButton && "mr-3", iconClassName)
-					}),
-					isLoading,
-					"aria-hidden": "true",
-					"data-testid": "loader"
-				})
-			}),
-			children && /* @__PURE__ */ jsx("span", {
-				className: "flex-1 truncate whitespace-nowrap",
-				children
-			}),
-			!children && isIconOnly && /* @__PURE__ */ jsx("span", {
-				className: "sr-only",
-				children: label
-			}),
-			IconRight && /* @__PURE__ */ jsx(IconRight, {
-				className: buttonIconVariants({
-					size,
-					className: cn(!isSquareButton && "ml-3", iconClassName)
-				}),
-				"aria-hidden": "true"
-			})
-		]
-	});
-};
-
-//#endregion
-export { Button, ButtonColor, ButtonSize, ButtonTextAlign, ButtonVariant, buttonVariants };
+import{cn as e}from"../../utils/cn.mjs";import{ContainerRoundedSize as t}from"../Container/index.mjs";import{Loader as n}from"../Loader/index.mjs";import{cva as r}from"class-variance-authority";import{jsx as i,jsxs as a}from"react/jsx-runtime";let o=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.ICON_SM=`icon-sm`,e.ICON_MD=`icon-md`,e.ICON_LG=`icon-lg`,e.ICON_XL=`icon-xl`,e}({});const s=r(`flex-none shrink-0`,{variants:{size:{[`${o.SM}`]:`size-3`,[`${o.MD}`]:`size-4`,[`${o.LG}`]:`size-5`,[`${o.XL}`]:`size-6`,[`${o.ICON_SM}`]:`size-3`,[`${o.ICON_MD}`]:`size-4`,[`${o.ICON_LG}`]:`size-4`,[`${o.ICON_XL}`]:`size-5`}},defaultVariants:{size:o.MD}});let c=function(e){return e.DEFAULT=`default`,e.NONE=`none`,e.OUTLINE=`outline`,e.LINK=`link`,e.INVISIBLE_LINK=`invisible-link`,e.HOVERABLE=`hoverable`,e.FADE=`fade`,e.INPUT=`input`,e}({}),l=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e.DESTRUCTIVE=`destructive`,e.NEUTRAL=`neutral`,e.LIGHT=`light`,e.DARK=`dark`,e.TEXT=`text`,e.CARD=`card`,e.TEXT_INVERSE=`text-inverse`,e.CURRENT=`current`,e.ERROR=`error`,e.SUCCESS=`success`,e.CUSTOM=`custom`,e}({}),u=function(e){return e.LEFT=`left`,e.CENTER=`center`,e.RIGHT=`right`,e}({});const d=r(`relative inline-flex cursor-pointer items-center justify-center font-medium ring-0 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50`,{variants:{size:{[`${o.SM}`]:`min-h-7 px-3 text-xs max-md:py-1`,[`${o.MD}`]:`min-h-8 px-6 text-sm max-md:py-2`,[`${o.LG}`]:`min-h-10 px-8 text-lg max-md:py-3`,[`${o.XL}`]:`min-h-11 px-10 text-xl max-md:py-4`,[`${o.ICON_SM}`]:`p-1.5`,[`${o.ICON_MD}`]:`p-1.5`,[`${o.ICON_LG}`]:`p-2`,[`${o.ICON_XL}`]:`p-3`},color:{[`${l.PRIMARY}`]:`hover-primary-500/20 text-primary ring-primary-500/20 *:text-text-light`,[`${l.SECONDARY}`]:`hover-secondary-500/20 text-secondary ring-secondary-500/20 *:text-text-light`,[`${l.DESTRUCTIVE}`]:`hover-destructive-500/20 text-destructive ring-destructive-500/20 *:text-text-light`,[`${l.NEUTRAL}`]:`text-neutral ring-neutral-500/5 *:text-text-light`,[`${l.CARD}`]:`hover-card-500/20 text-card ring-card-500/20 *:text-text-light`,[`${l.LIGHT}`]:`hover-white-500/20 text-white ring-white/20 *:text-text-light`,[`${l.DARK}`]:`text-neutral-800 ring-text-light/50 *:text-text-light`,[`${l.TEXT}`]:`text-text ring-text/20 *:text-text-opposite`,[`${l.CURRENT}`]:`hover-current-500/10 text-current ring-current/10 *:text-text-light`,[`${l.TEXT_INVERSE}`]:`text-text-opposite ring-text-opposite/20 *:text-text`,[`${l.ERROR}`]:`hover-error-500/20 text-error ring-error/20 *:text-text-light`,[`${l.SUCCESS}`]:`hover-success-500/20 text-success ring-success/20 *:text-text-light`,[`${l.CUSTOM}`]:``},roundedSize:{[`${t.NONE}`]:`rounded-none`,[`${t.SM}`]:`rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl`,[`${t.MD}`]:`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,[`${t.LG}`]:`rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl`,[`${t.XL}`]:`rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl`,[`${t[`2xl`]}`]:`rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]`,[`${t[`3xl`]}`]:`rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]`,[`${t[`4xl`]}`]:`rounded-[3rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[4rem]`,[`${t[`5xl`]}`]:`rounded-[4rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[5rem]`,[`${t.FULL}`]:`rounded-full`},variant:{[`${c.DEFAULT}`]:[`bg-current`,`hover:bg-current/90`,`hover:ring-5`,`aria-selected:ring-5`],[`${c.OUTLINE}`]:[`rounded-2xl border-[1.3px] border-current bg-current/0 *:text-current!`,`hover:bg-current/20 focus-visible:bg-current/20`,`hover:ring-5 focus-visible:ring-5`,`aria-selected:ring-5`],[`${c.NONE}`]:`border-none bg-current/0 text-inherit hover:bg-current/0`,[`${c.LINK}`]:`h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent hover:underline`,[`${c.INVISIBLE_LINK}`]:`h-auto justify-start border-inherit bg-transparent px-1 underline-offset-4 *:text-current! hover:bg-transparent`,[`${c.HOVERABLE}`]:`rounded-lg border-none bg-current/0 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5`,[`${c.FADE}`]:[`rounded-lg border-none bg-current/10 ring-current/5 transition *:text-current! hover:bg-current/20 aria-[current]:bg-current/5`,`hover:ring-5 focus-visible:ring-5`,`aria-selected:ring-5`],[`${c.INPUT}`]:[`text-text`,`w-full select-text resize-none rounded-2xl text-base shadow-none outline-none supports-[corner-shape:squircle]:rounded-4xl`,`transition-shadow duration-100 md:text-sm`,`ring-0`,`disabled:opacity-50`,`text-text`,`bg-neutral-50 dark:bg-neutral-950`,`ring-neutral-100 dark:ring-neutral-700`,`hover:ring-3`,`aria-selected:ring-4`,`focus-visible:ring-3`,`disabled:ring-0`,`focus-visible:outline-none`,`[box-shadow:none] focus:[box-shadow:none]`,`aria-invalid:border-error`]},textAlign:{[`${u.LEFT}`]:`justify-start text-left`,[`${u.CENTER}`]:`justify-center text-center`,[`${u.RIGHT}`]:`justify-end text-right`},isFullWidth:{true:`w-full`,false:``}},defaultVariants:{variant:`${c.DEFAULT}`,size:`${o.MD}`,color:`${l.CUSTOM}`,roundedSize:`${t.MD}`,textAlign:`${u.CENTER}`,isFullWidth:!1}}),f=({variant:t,size:r,color:l,children:f,Icon:p,IconRight:m,iconClassName:h,isLoading:g=!1,isActive:_,isSelected:v,isFullWidth:y,roundedSize:b,textAlign:x,disabled:S,label:C,className:w,type:T=`button`,"aria-describedby":E,"aria-expanded":D,"aria-haspopup":O,"aria-pressed":k,...A})=>{let j=t===`${c.LINK}`||t===`${c.INVISIBLE_LINK}`,M=!f&&(p||m),N={"aria-label":M?C??void 0:void 0,"aria-labelledby":void 0,"aria-describedby":E,"aria-expanded":D,"aria-haspopup":O,"aria-pressed":_===void 0?k:_,"aria-busy":g,"aria-current":_?`page`:void 0,"aria-disabled":S||g,"aria-selected":v},P=r===o.ICON_SM||r===o.ICON_MD||r===o.ICON_LG||r===o.ICON_XL;return a(`button`,{disabled:g||S,role:j?`link`:`button`,type:T,className:d({variant:t,size:r,color:l,isFullWidth:y,roundedSize:b,textAlign:x??(m?u.LEFT:u.CENTER),className:w}),...N,...A,children:[p&&!g&&i(p,{className:s({size:r,className:e(!P&&`mr-3`,h)}),"aria-hidden":`true`}),i(`div`,{className:e(`flex items-center justify-center transition-[width] duration-300`,g&&r===o.SM&&`w-3`,g&&r===o.MD&&`w-4`,g&&r===o.LG&&`w-5`,g&&r===o.XL&&`w-6`),children:i(n,{className:s({size:r,className:e(!P&&`mr-3`,h)}),isLoading:g,"aria-hidden":`true`,"data-testid":`loader`})}),f&&i(`span`,{className:`flex-1 truncate whitespace-nowrap`,children:f}),!f&&M&&i(`span`,{className:`sr-only`,children:C}),m&&i(m,{className:s({size:r,className:e(!P&&`ml-3`,h)}),"aria-hidden":`true`})]})};export{f as Button,l as ButtonColor,o as ButtonSize,u as ButtonTextAlign,c as ButtonVariant,d as buttonVariants};
 //# sourceMappingURL=Button.mjs.map