@evolve.ui/core-components 1.0.0

package/Typography/Links.mjs

@@ -0,0 +1,51 @@
+'use client';
+import { cn } from "@evolve.ui/theme-system";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Typography/Links/Links.tsx
+function factory(classes) {
+	return forwardRef(({ as: Component = "a", className, disabled, href, navigate, onClick, size = "md", ...rest }, ref) => {
+		return /* @__PURE__ */ jsx(Component, {
+			"aria-disabled": disabled,
+			className: cn("cursor-pointer outline-offset-2 transition-colors hover:underline aria-disabled:cursor-not-allowed aria-disabled:text-link-disabled", {
+				"hui-link-md": size === "md",
+				"hui-link-sm": size === "sm",
+				"hui-link-xs": size === "xs"
+			}, classes, className),
+			href,
+			onClick: (e) => {
+				if (disabled) {
+					e.preventDefault();
+					return;
+				}
+				if (onClick) onClick(e);
+				if (e.defaultPrevented || !href) return;
+				if (href.startsWith("#") || /^\w+:/.test(href) || rest.target === "_blank") return;
+				if (navigate) navigate(href)(e);
+			},
+			ref,
+			tabIndex: 0,
+			...rest
+		});
+	});
+}
+const Link = factory("underline text-link-primary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+Link.displayName = "Link";
+const WeakLink = factory("underline text-link-secondary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+WeakLink.displayName = "WeakLink";
+const MonochromeLink = factory("underline text-link-monochrome hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+MonochromeLink.displayName = "MonochromeLink";
+const InverseLink = factory("underline text-link-inverse hui-focus-visible-outline-inverse");
+InverseLink.displayName = "InverseLink";
+const SubtleLink = factory("text-link-primary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+SubtleLink.displayName = "SubtleLink";
+const SubtleWeakLink = factory("text-link-secondary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+SubtleWeakLink.displayName = "SubtleWeakLink";
+const SubtleMonochromeLink = factory("text-link-monochrome hover:text-link-hover active:text-link-pressed hui-focus-visible-outline");
+SubtleMonochromeLink.displayName = "SubtleMonochromeLink";
+const SubtleInverseLink = factory("text-link-inverse hui-focus-visible-outline-inverse");
+SubtleInverseLink.displayName = "SubtleInverseLink";
+//#endregion
+export { InverseLink, Link, MonochromeLink, SubtleInverseLink, SubtleLink, SubtleMonochromeLink, SubtleWeakLink, WeakLink };
+
+//# sourceMappingURL=Links.mjs.map

package/Typography/Links.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Links.mjs","names":[],"sources":["../../src/Typography/Links/Links.tsx"],"sourcesContent":["import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps, ElementType } from 'react';\n\nfunction factory(classes: string) {\n    return forwardRef<\n        HTMLAnchorElement,\n        Omit<HTMLProps<HTMLAnchorElement>, 'size'> & {\n            /**\n             * Polymorphic component type. Use this to render as a Next.js Link or any other element.\n             * @example <Link as={NextLink} href=\"/about\">About</Link>\n             */\n            as?: ElementType;\n            /**\n             * Whether the link is disabled. Disables `onClick` as well.\n             */\n            disabled?: boolean;\n            /**\n             * Optional custom navigation handler. Called instead of default link behavior\n             * when no special case applies and `onClick` did not preventDefault.\n             *\n             * Receives the `href` and returns a click event handler.\n             */\n            navigate?: (href: string) => (e: React.MouseEvent<HTMLAnchorElement>) => void;\n            /**\n             * The size of the link to render.\n             *\n             * xs = extra small\n             * sm = small\n             * md = medium (default)\n             */\n            size?: 'xs' | 'sm' | 'md';\n        }\n    >(({ as: Component = 'a', className, disabled, href, navigate, onClick, size = 'md', ...rest }, ref) => {\n        return (\n            <Component\n                aria-disabled={disabled}\n                className={cn(\n                    'cursor-pointer outline-offset-2 transition-colors hover:underline aria-disabled:cursor-not-allowed aria-disabled:text-link-disabled',\n                    {\n                        'hui-link-md': size === 'md',\n                        'hui-link-sm': size === 'sm',\n                        'hui-link-xs': size === 'xs',\n                    },\n                    classes,\n                    className\n                )}\n                href={href}\n                onClick={(e: React.MouseEvent<HTMLAnchorElement>) => {\n                    if (disabled) {\n                        e.preventDefault();\n                        return;\n                    }\n\n                    if (onClick) {\n                        onClick(e);\n                    }\n\n                    if (e.defaultPrevented || !href) {\n                        return;\n                    }\n\n                    // Browser/default navigation handles these cases.\n                    if (href.startsWith('#') || /^\\w+:/.test(href) || rest.target === '_blank') {\n                        return;\n                    }\n\n                    if (navigate) {\n                        navigate(href)(e);\n                    }\n                }}\n                ref={ref}\n                tabIndex={0}\n                {...rest}\n            />\n        );\n    });\n}\n\nexport const Link = factory(\n    'underline text-link-primary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nLink.displayName = 'Link';\n\nexport const WeakLink = factory(\n    'underline text-link-secondary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nWeakLink.displayName = 'WeakLink';\n\nexport const MonochromeLink = factory(\n    'underline text-link-monochrome hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nMonochromeLink.displayName = 'MonochromeLink';\n\nexport const InverseLink = factory('underline text-link-inverse hui-focus-visible-outline-inverse');\nInverseLink.displayName = 'InverseLink';\n\nexport const SubtleLink = factory(\n    'text-link-primary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nSubtleLink.displayName = 'SubtleLink';\n\nexport const SubtleWeakLink = factory(\n    'text-link-secondary hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nSubtleWeakLink.displayName = 'SubtleWeakLink';\n\nexport const SubtleMonochromeLink = factory(\n    'text-link-monochrome hover:text-link-hover active:text-link-pressed hui-focus-visible-outline'\n);\nSubtleMonochromeLink.displayName = 'SubtleMonochromeLink';\n\nexport const SubtleInverseLink = factory('text-link-inverse hui-focus-visible-outline-inverse');\nSubtleInverseLink.displayName = 'SubtleInverseLink';\n"],"mappings":";;;;AAGA,SAAS,QAAQ,SAAiB;CAC9B,OAAO,YA4BJ,EAAE,IAAI,YAAY,KAAK,WAAW,UAAU,MAAM,UAAU,SAAS,OAAO,MAAM,GAAG,QAAQ,QAAQ;EACpG,OACI,oBAAC,WAAD;GACI,iBAAe;GACf,WAAW,GACP,uIACA;IACI,eAAe,SAAS;IACxB,eAAe,SAAS;IACxB,eAAe,SAAS;GAC5B,GACA,SACA,SACJ;GACM;GACN,UAAU,MAA2C;IACjD,IAAI,UAAU;KACV,EAAE,eAAe;KACjB;IACJ;IAEA,IAAI,SACA,QAAQ,CAAC;IAGb,IAAI,EAAE,oBAAoB,CAAC,MACvB;IAIJ,IAAI,KAAK,WAAW,GAAG,KAAK,QAAQ,KAAK,IAAI,KAAK,KAAK,WAAW,UAC9D;IAGJ,IAAI,UACA,SAAS,IAAI,CAAC,CAAC,CAAC;GAExB;GACK;GACL,UAAU;GACV,GAAI;EACP,CAAA;CAET,CAAC;AACL;AAEA,MAAa,OAAO,QAChB,sGACJ;AACA,KAAK,cAAc;AAEnB,MAAa,WAAW,QACpB,wGACJ;AACA,SAAS,cAAc;AAEvB,MAAa,iBAAiB,QAC1B,yGACJ;AACA,eAAe,cAAc;AAE7B,MAAa,cAAc,QAAQ,+DAA+D;AAClG,YAAY,cAAc;AAE1B,MAAa,aAAa,QACtB,4FACJ;AACA,WAAW,cAAc;AAEzB,MAAa,iBAAiB,QAC1B,8FACJ;AACA,eAAe,cAAc;AAE7B,MAAa,uBAAuB,QAChC,+FACJ;AACA,qBAAqB,cAAc;AAEnC,MAAa,oBAAoB,QAAQ,qDAAqD;AAC9F,kBAAkB,cAAc"}

package/Typography/Text.cjs

@@ -0,0 +1,178 @@
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+let _evolve_ui_theme_system = require("@evolve.ui/theme-system");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/Typography/Text/Text.tsx
+const colors = {
+	critical: "text-text-critical",
+	disabled: "text-text-disabled",
+	inactive: "text-text-inactive",
+	info: "text-text-info",
+	inverse: "text-text-inverse",
+	primary: "text-text-primary",
+	secondary: "text-text-secondary",
+	success: "text-text-success",
+	warning: "text-text-warning"
+};
+/**
+* H1 styled text. If you need a non `h1` with the same styles, use the classnames `hui-text-h1` and `text-text-[yourColor]`.
+*/
+const H1 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h1", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H1.displayName = "H1";
+/**
+* H2 styled text. If you need a non `h2` with the same styles, use the classnames `hui-text-h2` and `text-text-[yourColor]`.
+*/
+const H2 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h2", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H2.displayName = "H2";
+/**
+* H3 styled text. If you need a non `h3` with the same styles, use the classnames `hui-text-h3` and `text-text-[yourColor]`.
+*/
+const H3 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h3", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H3.displayName = "H3";
+/**
+* H4 styled text. If you need a non `h4` with the same styles, use the classnames `hui-text-h4` and `text-text-[yourColor]`.
+*/
+const H4 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h4", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H4.displayName = "H4";
+/**
+* H5 styled text. If you need a non `h5` with the same styles, use the classnames `hui-text-h5` and `text-text-[yourColor]`.
+*/
+const H5 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h5", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h5", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H5.displayName = "H5";
+/**
+* H6 styled text. If you need a non `h6` with the same styles, use the classnames `hui-text-h6` and `text-text-[yourColor]`.
+*/
+const H6 = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h6", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-h6", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H6.displayName = "H6";
+/**
+* BodyPrimary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-primary` and `text-text-[yourColor]`.
+*/
+const BodyPrimary = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-body-primary", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+BodyPrimary.displayName = "BodyPrimary";
+/**
+* BodySecondary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-secondary` and `text-text-[yourColor]`.
+*/
+const BodySecondary = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-body-secondary", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+BodySecondary.displayName = "BodySecondary";
+/**
+* Caption styled text. If you need a non `span` with the same styles, use the classnames `hui-text-caption` and `text-text-[yourColor]`.
+*/
+const Caption = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-caption", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+Caption.displayName = "Caption";
+/**
+* LabelMini styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini` and `text-text-[yourColor]`.
+*/
+const LabelMini = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-label-mini", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelMini.displayName = "LabelMini";
+/**
+* LabelMiniStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini-strong` and `text-text-[yourColor]`.
+*/
+const LabelMiniStrong = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-label-mini-strong", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelMiniStrong.displayName = "LabelMiniStrong";
+/**
+* LabelStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-strong` and `text-text-[yourColor]`.
+*/
+const LabelStrong = (0, react.forwardRef)(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+		className: (0, _evolve_ui_theme_system.cn)("hui-text-label-strong", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelStrong.displayName = "LabelStrong";
+//#endregion
+exports.BodyPrimary = BodyPrimary;
+exports.BodySecondary = BodySecondary;
+exports.Caption = Caption;
+exports.H1 = H1;
+exports.H2 = H2;
+exports.H3 = H3;
+exports.H4 = H4;
+exports.H5 = H5;
+exports.H6 = H6;
+exports.LabelMini = LabelMini;
+exports.LabelMiniStrong = LabelMiniStrong;
+exports.LabelStrong = LabelStrong;
+
+//# sourceMappingURL=Text.cjs.map

package/Typography/Text.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.cjs","names":[],"sources":["../../src/Typography/Text/Text.tsx"],"sourcesContent":["import { cn, type TextColorAliases } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps } from 'react';\n\ntype ColorProp = {\n    /**\n     * Pass any text color like 'primary', 'secondary', 'critical', 'success', 'info', 'inverse', etc.\n     *\n     * You can access all of these colors through tailwind through `text-text-[color]` like `text-text-primary`, etc.\n     */\n    color?: TextColorAliases;\n};\n\nconst colors = {\n    critical: 'text-text-critical',\n    disabled: 'text-text-disabled',\n    inactive: 'text-text-inactive',\n    info: 'text-text-info',\n    inverse: 'text-text-inverse',\n    primary: 'text-text-primary',\n    secondary: 'text-text-secondary',\n    success: 'text-text-success',\n    warning: 'text-text-warning',\n} satisfies Record<TextColorAliases, string>;\n\n/**\n * H1 styled text. If you need a non `h1` with the same styles, use the classnames `hui-text-h1` and `text-text-[yourColor]`.\n */\nexport const H1 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h1\n                className={cn('hui-text-h1', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h1>\n        );\n    }\n);\nH1.displayName = 'H1';\n\n/**\n * H2 styled text. If you need a non `h2` with the same styles, use the classnames `hui-text-h2` and `text-text-[yourColor]`.\n */\nexport const H2 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h2\n                className={cn('hui-text-h2', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h2>\n        );\n    }\n);\nH2.displayName = 'H2';\n\n/**\n * H3 styled text. If you need a non `h3` with the same styles, use the classnames `hui-text-h3` and `text-text-[yourColor]`.\n */\nexport const H3 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h3\n                className={cn('hui-text-h3', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h3>\n        );\n    }\n);\nH3.displayName = 'H3';\n\n/**\n * H4 styled text. If you need a non `h4` with the same styles, use the classnames `hui-text-h4` and `text-text-[yourColor]`.\n */\nexport const H4 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h4\n                className={cn('hui-text-h4', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h4>\n        );\n    }\n);\nH4.displayName = 'H4';\n\n/**\n * H5 styled text. If you need a non `h5` with the same styles, use the classnames `hui-text-h5` and `text-text-[yourColor]`.\n */\nexport const H5 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h5\n                className={cn('hui-text-h5', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h5>\n        );\n    }\n);\nH5.displayName = 'H5';\n\n/**\n * H6 styled text. If you need a non `h6` with the same styles, use the classnames `hui-text-h6` and `text-text-[yourColor]`.\n */\nexport const H6 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h6\n                className={cn('hui-text-h6', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h6>\n        );\n    }\n);\nH6.displayName = 'H6';\n\n/**\n * BodyPrimary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-primary` and `text-text-[yourColor]`.\n */\nexport const BodyPrimary = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-body-primary', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nBodyPrimary.displayName = 'BodyPrimary';\n\n/**\n * BodySecondary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-secondary` and `text-text-[yourColor]`.\n */\nexport const BodySecondary = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-body-secondary', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nBodySecondary.displayName = 'BodySecondary';\n\n/**\n * Caption styled text. If you need a non `span` with the same styles, use the classnames `hui-text-caption` and `text-text-[yourColor]`.\n */\nexport const Caption = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-caption', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nCaption.displayName = 'Caption';\n\n/**\n * LabelMini styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini` and `text-text-[yourColor]`.\n */\nexport const LabelMini = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-mini', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelMini.displayName = 'LabelMini';\n\n/**\n * LabelMiniStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini-strong` and `text-text-[yourColor]`.\n */\nexport const LabelMiniStrong = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-mini-strong', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelMiniStrong.displayName = 'LabelMiniStrong';\n\n/**\n * LabelStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-strong` and `text-text-[yourColor]`.\n */\nexport const LabelStrong = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-strong', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelStrong.displayName = 'LabelStrong';\n"],"mappings":"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"}

package/Typography/Text.d.cts

@@ -0,0 +1,2 @@
+import { a as H2, c as H5, d as LabelMiniStrong, f as LabelStrong, i as H1, l as H6, n as BodySecondary, o as H3, r as Caption, s as H4, t as BodyPrimary, u as LabelMini } from "../Text-BVoakc0X.cjs";
+export { BodyPrimary, BodySecondary, Caption, H1, H2, H3, H4, H5, H6, LabelMini, LabelMiniStrong, LabelStrong };

package/Typography/Text.d.mts

@@ -0,0 +1,2 @@
+import { a as H2, c as H5, d as LabelMiniStrong, f as LabelStrong, i as H1, l as H6, n as BodySecondary, o as H3, r as Caption, s as H4, t as BodyPrimary, u as LabelMini } from "../Text-OlyNC1yj.mjs";
+export { BodyPrimary, BodySecondary, Caption, H1, H2, H3, H4, H5, H6, LabelMini, LabelMiniStrong, LabelStrong };

package/Typography/Text.mjs

@@ -0,0 +1,163 @@
+import { cn } from "@evolve.ui/theme-system";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Typography/Text/Text.tsx
+const colors = {
+	critical: "text-text-critical",
+	disabled: "text-text-disabled",
+	inactive: "text-text-inactive",
+	info: "text-text-info",
+	inverse: "text-text-inverse",
+	primary: "text-text-primary",
+	secondary: "text-text-secondary",
+	success: "text-text-success",
+	warning: "text-text-warning"
+};
+/**
+* H1 styled text. If you need a non `h1` with the same styles, use the classnames `hui-text-h1` and `text-text-[yourColor]`.
+*/
+const H1 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h1", {
+		className: cn("hui-text-h1", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H1.displayName = "H1";
+/**
+* H2 styled text. If you need a non `h2` with the same styles, use the classnames `hui-text-h2` and `text-text-[yourColor]`.
+*/
+const H2 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h2", {
+		className: cn("hui-text-h2", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H2.displayName = "H2";
+/**
+* H3 styled text. If you need a non `h3` with the same styles, use the classnames `hui-text-h3` and `text-text-[yourColor]`.
+*/
+const H3 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h3", {
+		className: cn("hui-text-h3", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H3.displayName = "H3";
+/**
+* H4 styled text. If you need a non `h4` with the same styles, use the classnames `hui-text-h4` and `text-text-[yourColor]`.
+*/
+const H4 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h4", {
+		className: cn("hui-text-h4", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H4.displayName = "H4";
+/**
+* H5 styled text. If you need a non `h5` with the same styles, use the classnames `hui-text-h5` and `text-text-[yourColor]`.
+*/
+const H5 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h5", {
+		className: cn("hui-text-h5", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H5.displayName = "H5";
+/**
+* H6 styled text. If you need a non `h6` with the same styles, use the classnames `hui-text-h6` and `text-text-[yourColor]`.
+*/
+const H6 = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("h6", {
+		className: cn("hui-text-h6", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+H6.displayName = "H6";
+/**
+* BodyPrimary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-primary` and `text-text-[yourColor]`.
+*/
+const BodyPrimary = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("hui-text-body-primary", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+BodyPrimary.displayName = "BodyPrimary";
+/**
+* BodySecondary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-secondary` and `text-text-[yourColor]`.
+*/
+const BodySecondary = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("hui-text-body-secondary", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+BodySecondary.displayName = "BodySecondary";
+/**
+* Caption styled text. If you need a non `span` with the same styles, use the classnames `hui-text-caption` and `text-text-[yourColor]`.
+*/
+const Caption = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("hui-text-caption", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+Caption.displayName = "Caption";
+/**
+* LabelMini styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini` and `text-text-[yourColor]`.
+*/
+const LabelMini = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("label", {
+		className: cn("hui-text-label-mini", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelMini.displayName = "LabelMini";
+/**
+* LabelMiniStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini-strong` and `text-text-[yourColor]`.
+*/
+const LabelMiniStrong = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("label", {
+		className: cn("hui-text-label-mini-strong", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelMiniStrong.displayName = "LabelMiniStrong";
+/**
+* LabelStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-strong` and `text-text-[yourColor]`.
+*/
+const LabelStrong = forwardRef(({ children, className, color = "primary", ...props }, ref) => {
+	return /* @__PURE__ */ jsx("label", {
+		className: cn("hui-text-label-strong", colors[color], className),
+		ref,
+		...props,
+		children
+	});
+});
+LabelStrong.displayName = "LabelStrong";
+//#endregion
+export { BodyPrimary, BodySecondary, Caption, H1, H2, H3, H4, H5, H6, LabelMini, LabelMiniStrong, LabelStrong };
+
+//# sourceMappingURL=Text.mjs.map

package/Typography/Text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.mjs","names":[],"sources":["../../src/Typography/Text/Text.tsx"],"sourcesContent":["import { cn, type TextColorAliases } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps } from 'react';\n\ntype ColorProp = {\n    /**\n     * Pass any text color like 'primary', 'secondary', 'critical', 'success', 'info', 'inverse', etc.\n     *\n     * You can access all of these colors through tailwind through `text-text-[color]` like `text-text-primary`, etc.\n     */\n    color?: TextColorAliases;\n};\n\nconst colors = {\n    critical: 'text-text-critical',\n    disabled: 'text-text-disabled',\n    inactive: 'text-text-inactive',\n    info: 'text-text-info',\n    inverse: 'text-text-inverse',\n    primary: 'text-text-primary',\n    secondary: 'text-text-secondary',\n    success: 'text-text-success',\n    warning: 'text-text-warning',\n} satisfies Record<TextColorAliases, string>;\n\n/**\n * H1 styled text. If you need a non `h1` with the same styles, use the classnames `hui-text-h1` and `text-text-[yourColor]`.\n */\nexport const H1 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h1\n                className={cn('hui-text-h1', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h1>\n        );\n    }\n);\nH1.displayName = 'H1';\n\n/**\n * H2 styled text. If you need a non `h2` with the same styles, use the classnames `hui-text-h2` and `text-text-[yourColor]`.\n */\nexport const H2 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h2\n                className={cn('hui-text-h2', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h2>\n        );\n    }\n);\nH2.displayName = 'H2';\n\n/**\n * H3 styled text. If you need a non `h3` with the same styles, use the classnames `hui-text-h3` and `text-text-[yourColor]`.\n */\nexport const H3 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h3\n                className={cn('hui-text-h3', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h3>\n        );\n    }\n);\nH3.displayName = 'H3';\n\n/**\n * H4 styled text. If you need a non `h4` with the same styles, use the classnames `hui-text-h4` and `text-text-[yourColor]`.\n */\nexport const H4 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h4\n                className={cn('hui-text-h4', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h4>\n        );\n    }\n);\nH4.displayName = 'H4';\n\n/**\n * H5 styled text. If you need a non `h5` with the same styles, use the classnames `hui-text-h5` and `text-text-[yourColor]`.\n */\nexport const H5 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h5\n                className={cn('hui-text-h5', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h5>\n        );\n    }\n);\nH5.displayName = 'H5';\n\n/**\n * H6 styled text. If you need a non `h6` with the same styles, use the classnames `hui-text-h6` and `text-text-[yourColor]`.\n */\nexport const H6 = forwardRef<HTMLHeadingElement, HTMLProps<HTMLHeadingElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <h6\n                className={cn('hui-text-h6', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </h6>\n        );\n    }\n);\nH6.displayName = 'H6';\n\n/**\n * BodyPrimary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-primary` and `text-text-[yourColor]`.\n */\nexport const BodyPrimary = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-body-primary', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nBodyPrimary.displayName = 'BodyPrimary';\n\n/**\n * BodySecondary styled text. If you need a non `span` with the same styles, use the classnames `hui-text-body-secondary` and `text-text-[yourColor]`.\n */\nexport const BodySecondary = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-body-secondary', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nBodySecondary.displayName = 'BodySecondary';\n\n/**\n * Caption styled text. If you need a non `span` with the same styles, use the classnames `hui-text-caption` and `text-text-[yourColor]`.\n */\nexport const Caption = forwardRef<HTMLSpanElement, HTMLProps<HTMLSpanElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <span\n                className={cn('hui-text-caption', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </span>\n        );\n    }\n);\nCaption.displayName = 'Caption';\n\n/**\n * LabelMini styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini` and `text-text-[yourColor]`.\n */\nexport const LabelMini = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-mini', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelMini.displayName = 'LabelMini';\n\n/**\n * LabelMiniStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-mini-strong` and `text-text-[yourColor]`.\n */\nexport const LabelMiniStrong = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-mini-strong', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelMiniStrong.displayName = 'LabelMiniStrong';\n\n/**\n * LabelStrong styled text. If you need a non `label` with the same styles, use the classnames `hui-text-label-strong` and `text-text-[yourColor]`.\n */\nexport const LabelStrong = forwardRef<HTMLLabelElement, HTMLProps<HTMLLabelElement> & ColorProp>(\n    ({ children, className, color = 'primary', ...props }, ref) => {\n        return (\n            <label\n                className={cn('hui-text-label-strong', colors[color], className)}\n                ref={ref}\n                {...props}\n            >\n                {children}\n            </label>\n        );\n    }\n);\nLabelStrong.displayName = 'LabelStrong';\n"],"mappings":"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"}

package/ViewMore-BBoUvo7p.cjs

@@ -0,0 +1,138 @@
+const require_Icons = require("./Icons.cjs");
+const require_Typography_InlineButton = require("./Typography/InlineButton.cjs");
+const require_effectEventListener = require("./effectEventListener-DmVY5Sgy.cjs");
+let _evolve_ui_theme_system = require("@evolve.ui/theme-system");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/utils/smoothScrollTo.ts
+/**
+* Easing function for smooth scroll animation
+* Uses cubic easing in-out curve
+* @param t - Progress value between 0 and 1
+* @returns Eased progress value
+*/
+const easeInOutCubic = (t) => {
+	return t < .5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
+};
+/**
+* Smoothly scrolls the window to a specific vertical position using requestAnimationFrame
+* @param targetY - The target vertical scroll position in pixels
+* @param duration - The duration of the scroll animation in milliseconds (defaults to 300ms)
+*
+* @example
+* ```tsx
+* // Scroll to 500px from the top over 300ms
+* smoothScrollTo(500);
+*
+* // Scroll to top of an element with custom duration
+* const element = document.getElementById('my-element');
+* if (element) {
+*   const targetY = element.getBoundingClientRect().top + window.scrollY;
+*   smoothScrollTo(targetY, 500);
+* }
+* ```
+*/
+const smoothScrollTo = (targetY, duration = 300) => {
+	const startY = window.scrollY;
+	const distance = targetY - startY;
+	const startTime = performance.now();
+	const scroll = (currentTime) => {
+		const elapsed = currentTime - startTime;
+		const progress = Math.min(elapsed / duration, 1);
+		const easeProgress = easeInOutCubic(progress);
+		window.scrollTo(0, startY + distance * easeProgress);
+		if (progress < 1) requestAnimationFrame(scroll);
+	};
+	requestAnimationFrame(scroll);
+};
+//#endregion
+//#region src/ViewMore/ViewMore.tsx
+const SCROLL_TOP_OFFSET = 100;
+const SCROLL_DURATION = 200;
+const ViewMore = ({ centerInlineButton, children, className, collapseText = "Read Less", defaultExpanded = false, disableExpand = false, expandText = "Read More", fadeBackgroundColor, onChange, onClick, removeFadeBackgroundColor, showIcon = false, textCutoffHeight = 150, useWeakInlineButton }) => {
+	const [isExpanded, setIsExpanded] = (0, react.useState)(defaultExpanded);
+	const [height, setHeight] = (0, react.useState)(defaultExpanded ? 9999 : textCutoffHeight);
+	const [showViewToggle, setShowViewToggle] = (0, react.useState)(false);
+	const [enableTransitions, setEnableTransitions] = (0, react.useState)(false);
+	const containerRef = (0, react.useRef)(null);
+	const contentRef = (0, react.useRef)(null);
+	const toggleDescription = (0, react.useCallback)((event) => {
+		onClick?.(event);
+		if (disableExpand) return;
+		setEnableTransitions(true);
+		setIsExpanded((prevIsExpanded) => {
+			const newHeight = prevIsExpanded ? textCutoffHeight : contentRef.current?.scrollHeight ?? textCutoffHeight;
+			setHeight(newHeight);
+			onChange?.(!prevIsExpanded);
+			if (prevIsExpanded && containerRef.current) smoothScrollTo(containerRef.current.getBoundingClientRect().top + window.scrollY - SCROLL_TOP_OFFSET, SCROLL_DURATION);
+			return !prevIsExpanded;
+		});
+	}, [
+		textCutoffHeight,
+		onChange,
+		onClick,
+		disableExpand
+	]);
+	const updateView = (0, react.useCallback)(() => {
+		if (!contentRef.current) return;
+		const scrollHeight = contentRef.current.scrollHeight;
+		const shouldShowToggle = scrollHeight > textCutoffHeight;
+		setShowViewToggle(shouldShowToggle);
+		setHeight(isExpanded || !shouldShowToggle ? scrollHeight : textCutoffHeight);
+	}, [isExpanded, textCutoffHeight]);
+	(0, react.useEffect)(() => {
+		if (!contentRef.current) return;
+		updateView();
+		const cleanupResizeListener = require_effectEventListener.effectEventListener(window, "resize", updateView);
+		const resizeObserver = new ResizeObserver(updateView);
+		resizeObserver.observe(contentRef.current);
+		return () => {
+			cleanupResizeListener();
+			resizeObserver.disconnect();
+		};
+	}, [updateView, children]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: (0, _evolve_ui_theme_system.cn)(className, "flex flex-col gap-xs"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: (0, _evolve_ui_theme_system.cn)("relative overflow-hidden", { "transition-all duration-300 ease-in-out": enableTransitions }),
+			"data-testid": "description-container",
+			ref: containerRef,
+			style: {
+				height: showViewToggle ? `${height}px` : "auto",
+				maxHeight: showViewToggle || isExpanded ? void 0 : `${textCutoffHeight}px`
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				ref: contentRef,
+				children
+			}), showViewToggle && !removeFadeBackgroundColor && !isExpanded && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "absolute bottom-0 left-0 right-0 h-xl w-full",
+				style: { background: fadeBackgroundColor ? `linear-gradient(to bottom, transparent, ${fadeBackgroundColor})` : `linear-gradient(to bottom, transparent, ${(0, _evolve_ui_theme_system.wrapVarRgb)("--color-background-primary")})` }
+			})]
+		}), showViewToggle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: (0, _evolve_ui_theme_system.cn)("w-full", { "text-center": centerInlineButton }),
+			children: useWeakInlineButton ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography_InlineButton.InlineButton, {
+				className: "w-fit",
+				icon: showIcon ? isExpanded ? require_Icons.CaretUp : require_Icons.CaretDown : void 0,
+				iconPlacement: "right",
+				onClick: toggleDescription,
+				style: "neutral",
+				children: isExpanded ? collapseText : expandText
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography_InlineButton.InlineButton, {
+				className: "w-fit",
+				icon: showIcon ? isExpanded ? require_Icons.CaretUp : require_Icons.CaretDown : void 0,
+				iconPlacement: "right",
+				onClick: toggleDescription,
+				children: isExpanded ? collapseText : expandText
+			})
+		})]
+	});
+};
+//#endregion
+Object.defineProperty(exports, "ViewMore", {
+	enumerable: true,
+	get: function() {
+		return ViewMore;
+	}
+});
+
+//# sourceMappingURL=ViewMore-BBoUvo7p.cjs.map

package/ViewMore-BBoUvo7p.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewMore-BBoUvo7p.cjs","names":["effectEventListener","InlineButton","CaretUp","CaretDown"],"sources":["../src/utils/smoothScrollTo.ts","../src/ViewMore/ViewMore.tsx"],"sourcesContent":["/**\n * Easing function for smooth scroll animation\n * Uses cubic easing in-out curve\n * @param t - Progress value between 0 and 1\n * @returns Eased progress value\n */\nconst easeInOutCubic = (t: number): number => {\n    return t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;\n};\n\n/**\n * Smoothly scrolls the window to a specific vertical position using requestAnimationFrame\n * @param targetY - The target vertical scroll position in pixels\n * @param duration - The duration of the scroll animation in milliseconds (defaults to 300ms)\n *\n * @example\n * ```tsx\n * // Scroll to 500px from the top over 300ms\n * smoothScrollTo(500);\n *\n * // Scroll to top of an element with custom duration\n * const element = document.getElementById('my-element');\n * if (element) {\n *   const targetY = element.getBoundingClientRect().top + window.scrollY;\n *   smoothScrollTo(targetY, 500);\n * }\n * ```\n */\nexport const smoothScrollTo = (targetY: number, duration: number = 300): void => {\n    const startY = window.scrollY;\n    const distance = targetY - startY;\n    const startTime = performance.now();\n\n    const scroll = (currentTime: number) => {\n        const elapsed = currentTime - startTime;\n        const progress = Math.min(elapsed / duration, 1);\n        const easeProgress = easeInOutCubic(progress);\n\n        window.scrollTo(0, startY + distance * easeProgress);\n\n        if (progress < 1) {\n            requestAnimationFrame(scroll);\n        }\n    };\n\n    requestAnimationFrame(scroll);\n};\n","import { cn, wrapVarRgb } from '@evolve.ui/theme-system';\nimport { MouseEvent, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { CaretDown, CaretUp } from '../Icons';\nimport { InlineButton } from '../Typography/InlineButton/InlineButton';\nimport { effectEventListener } from '../utils/effectEventListener';\nimport { smoothScrollTo } from '../utils/smoothScrollTo';\n\nconst SCROLL_TOP_OFFSET = 100;\nconst SCROLL_DURATION = 200;\n\ntype Props = {\n    /**\n     * Determines whether to center the inline button.\n     */\n    centerInlineButton?: boolean;\n    /**\n     * The inner text description or content to display.\n     *\n     */\n    children: React.ReactNode;\n    className?: string;\n    /**\n     * Custom text for the collapse button.\n     *\n     * @default 'Read Less'\n     */\n    collapseText?: string;\n    /**\n     * Whether the view more should be expanded by default.\n     *\n     * @default false\n     */\n    defaultExpanded?: boolean;\n    /**\n     * Prevents expansion/collapse while still allowing onClick callback to fire.\n     * Useful when you want to control the expansion behavior externally.\n     *\n     * @default false\n     */\n    disableExpand?: boolean;\n    /**\n     * Custom text for the expand button.\n     *\n     * @default 'Read More'\n     */\n    expandText?: string;\n    /**\n     * Custom fade color.\n     */\n    fadeBackgroundColor?: string;\n    /**\n     * Callback function that is called when the view more is expanded or collapsed.\n     */\n    onChange?: (isExpanded: boolean) => void;\n    /**\n     * Callback function that is called when the view more button is clicked.\n     * Can be used to track analytics or trigger other actions when the view more is interacted with.\n     * Use the `disableExpand` prop if you want to prevent the default expansion/collapse behavior.\n     */\n    onClick?: (event: MouseEvent<HTMLButtonElement>) => void;\n    /**\n     * Determines whether to remove the fade background color.\n     */\n    removeFadeBackgroundColor?: boolean;\n    /**\n     * Whether to display caret icons (CaretDown/CaretUp) alongside the button text.\n     *\n     * @default false\n     */\n    showIcon?: boolean;\n    /**\n     * Number in pixels at which the text description will cut off and show the expand toggle.\n     *\n     * @default 150\n     */\n    textCutoffHeight?: number;\n    /**\n     * Determines whether to use a weak inline button.\n     */\n    useWeakInlineButton?: boolean;\n};\n\nexport const ViewMore = ({\n    centerInlineButton,\n    children,\n    className,\n    collapseText = 'Read Less',\n    defaultExpanded = false,\n    disableExpand = false,\n    expandText = 'Read More',\n    fadeBackgroundColor,\n    onChange,\n    onClick,\n    removeFadeBackgroundColor,\n    showIcon = false,\n    textCutoffHeight = 150,\n    useWeakInlineButton,\n}: Props) => {\n    const [isExpanded, setIsExpanded] = useState<boolean>(defaultExpanded);\n    // Set initial height for SSR-friendly rendering:\n    // - When expanded: Use large value (9999px) to show all content before useEffect measures actual height\n    // - When collapsed: Use textCutoffHeight to truncate content appropriately\n    const [height, setHeight] = useState<number>(defaultExpanded ? 9999 : textCutoffHeight);\n    const [showViewToggle, setShowViewToggle] = useState<boolean>(false);\n    const [enableTransitions, setEnableTransitions] = useState<boolean>(false);\n\n    const containerRef = useRef<HTMLDivElement>(null);\n    const contentRef = useRef<HTMLDivElement>(null);\n\n    const toggleDescription = useCallback(\n        (event: MouseEvent<HTMLButtonElement>) => {\n            onClick?.(event);\n\n            // If disableExpand is true, call onClick but don't toggle the expansion\n            if (disableExpand) {\n                return;\n            }\n\n            // Enable transitions on first user interaction\n            setEnableTransitions(true);\n\n            setIsExpanded((prevIsExpanded) => {\n                const newHeight = prevIsExpanded\n                    ? textCutoffHeight\n                    : (contentRef.current?.scrollHeight ?? textCutoffHeight);\n                setHeight(newHeight);\n                onChange?.(!prevIsExpanded);\n\n                // Scroll to top when collapsing with custom smooth scroll to match 300ms transition\n                if (prevIsExpanded && containerRef.current) {\n                    const top = containerRef.current.getBoundingClientRect().top + window.scrollY - SCROLL_TOP_OFFSET;\n                    smoothScrollTo(top, SCROLL_DURATION);\n                }\n\n                return !prevIsExpanded;\n            });\n        },\n        [textCutoffHeight, onChange, onClick, disableExpand]\n    );\n\n    const updateView = useCallback(() => {\n        if (!contentRef.current) {\n            return;\n        }\n\n        const scrollHeight = contentRef.current.scrollHeight;\n        const shouldShowToggle = scrollHeight > textCutoffHeight;\n        setShowViewToggle(shouldShowToggle);\n        setHeight(isExpanded || !shouldShowToggle ? scrollHeight : textCutoffHeight);\n    }, [isExpanded, textCutoffHeight]);\n\n    useEffect(() => {\n        if (!contentRef.current) {\n            return;\n        }\n        updateView();\n\n        const cleanupResizeListener = effectEventListener(window, 'resize', updateView);\n\n        // Add ResizeObserver to detect content height changes\n        const resizeObserver = new ResizeObserver(updateView);\n        resizeObserver.observe(contentRef.current);\n\n        return () => {\n            cleanupResizeListener();\n            resizeObserver.disconnect();\n        };\n    }, [updateView, children]);\n\n    return (\n        <div className={cn(className, 'flex flex-col gap-xs')}>\n            <div\n                className={cn('relative overflow-hidden', {\n                    'transition-all duration-300 ease-in-out': enableTransitions,\n                })}\n                data-testid=\"description-container\"\n                ref={containerRef}\n                style={{\n                    height: showViewToggle ? `${height}px` : 'auto',\n                    maxHeight: showViewToggle || isExpanded ? undefined : `${textCutoffHeight}px`,\n                }}\n            >\n                <div ref={contentRef}>{children}</div>\n                {showViewToggle && !removeFadeBackgroundColor && !isExpanded && (\n                    <div\n                        className=\"absolute bottom-0 left-0 right-0 h-xl w-full\"\n                        style={{\n                            background: fadeBackgroundColor\n                                ? `linear-gradient(to bottom, transparent, ${fadeBackgroundColor})`\n                                : `linear-gradient(to bottom, transparent, ${wrapVarRgb('--color-background-primary')})`,\n                        }}\n                    />\n                )}\n            </div>\n            {showViewToggle && (\n                <div\n                    className={cn('w-full', {\n                        'text-center': centerInlineButton,\n                    })}\n                >\n                    {useWeakInlineButton ? (\n                        <InlineButton\n                            className=\"w-fit\"\n                            icon={showIcon ? (isExpanded ? CaretUp : CaretDown) : undefined}\n                            iconPlacement=\"right\"\n                            onClick={toggleDescription}\n                            style=\"neutral\"\n                        >\n                            {isExpanded ? collapseText : expandText}\n                        </InlineButton>\n                    ) : (\n                        <InlineButton\n                            className=\"w-fit\"\n                            icon={showIcon ? (isExpanded ? CaretUp : CaretDown) : undefined}\n                            iconPlacement=\"right\"\n                            onClick={toggleDescription}\n                        >\n                            {isExpanded ? collapseText : expandText}\n                        </InlineButton>\n                    )}\n                </div>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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"}