@envive-ai/react-toolkit 0.2.1 → 0.2.3

package/dist/ToggleButton/index.d.ts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime27 from "react/jsx-runtime";
+
+//#region src/components/ToggleButton/ToggleButton.d.ts
+type ToggleButtonProps = {
+  isSelected: boolean;
+  variant: ToggleButtonVariant;
+  onClick: () => void;
+  label: string;
+  buttonClassName?: string;
+  labelClassName?: string;
+  secondaryLabel?: string;
+  secondaryLabelClassName?: string;
+  icon?: React.ReactNode;
+  iconClassName?: string;
+};
+type ToggleButtonVariant = 'default';
+declare const ToggleButton: ({
+  isSelected,
+  onClick,
+  label,
+  buttonClassName,
+  labelClassName,
+  secondaryLabel,
+  secondaryLabelClassName,
+  icon,
+  iconClassName,
+  variant
+}: ToggleButtonProps) => react_jsx_runtime27.JSX.Element;
+//#endregion
+export { ToggleButton, ToggleButtonProps, ToggleButtonVariant };

package/dist/ToggleButton/index.js

@@ -0,0 +1,4 @@
+import "../Typography-D3vDkBMS.js";
+import { ToggleButton } from "../ToggleButton-Br6MgjiG.js";
+
+export { ToggleButton };

package/dist/ToggleButton-Br6MgjiG.js

@@ -0,0 +1,60 @@
+import { Typography } from "./Typography-D3vDkBMS.js";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/ToggleButton/ToggleButton.tsx
+const toggleButtonVariants = { default: {
+	button: ({ isSelected }) => classNames({
+		"spiffy-tw-bg-[--spiffy-colors-background-dark]": isSelected,
+		"spiffy-tw-border-[--spiffy-colors-background-dark]": isSelected,
+		"spiffy-tw-text-[--spiffy-colors-text-light]": isSelected,
+		"hover:spiffy-tw-bg-[--spiffy-colors-background-secondary-dark]": true,
+		"hover:spiffy-tw-text-[--spiffy-colors-text-primary]": isSelected,
+		"spiffy-tw-bg-[--spiffy-colors-background-light]": !isSelected,
+		"spiffy-tw-border-[--spiffy-colors-border-light]": !isSelected,
+		"spiffy-tw-text-[--spiffy-colors-text-primary]": !isSelected
+	}),
+	label: () => "",
+	secondaryLabel: ({ isSelected }) => classNames({
+		"spiffy-tw-text-[--spiffy-colors-text-secondary]": !isSelected,
+		"hover:spiffy-tw-text-[--spiffy-colors-text-secondary]": !isSelected
+	})
+} };
+const ToggleButton = ({ isSelected, onClick, label, buttonClassName, labelClassName, secondaryLabel, secondaryLabelClassName, icon, iconClassName, variant }) => {
+	const buttonClassNames = classNames({
+		"spiffy-tw-flex": true,
+		"spiffy-tw-items-center": true,
+		"spiffy-tw-gap-[4px]": true,
+		"spiffy-tw-cursor-pointer": true,
+		"spiffy-tw-py-[8px]": true,
+		"spiffy-tw-px-[12px]": true,
+		"spiffy-tw-rounded-[200px]": true,
+		"spiffy-tw-border": true
+	}, toggleButtonVariants?.[variant]?.button({ isSelected }), buttonClassName);
+	const labelClassNames = classNames({}, toggleButtonVariants?.[variant]?.label({ isSelected }), labelClassName);
+	const secondaryLabelClassNames = classNames({}, toggleButtonVariants?.[variant]?.secondaryLabel({ isSelected }), secondaryLabelClassName);
+	return /* @__PURE__ */ jsxs("button", {
+		className: buttonClassNames,
+		onClick,
+		type: "button",
+		children: [
+			icon && /* @__PURE__ */ jsx("div", {
+				className: iconClassName,
+				children: icon
+			}),
+			/* @__PURE__ */ jsx(Typography, {
+				variant: "body3",
+				className: labelClassNames,
+				children: label
+			}),
+			secondaryLabel && /* @__PURE__ */ jsx(Typography, {
+				variant: "body4",
+				className: secondaryLabelClassNames,
+				children: secondaryLabel
+			})
+		]
+	});
+};
+
+//#endregion
+export { ToggleButton };

package/dist/ToggleButton-CJ74eu-N.cjs

@@ -0,0 +1,68 @@
+const require_chunk = require('./chunk-CUT6urMc.cjs');
+const require_Typography = require('./Typography-CFNWgbM5.cjs');
+let classnames = require("classnames");
+classnames = require_chunk.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_chunk.__toESM(react_jsx_runtime);
+
+//#region src/components/ToggleButton/ToggleButton.tsx
+const toggleButtonVariants = { default: {
+	button: ({ isSelected }) => (0, classnames.default)({
+		"spiffy-tw-bg-[--spiffy-colors-background-dark]": isSelected,
+		"spiffy-tw-border-[--spiffy-colors-background-dark]": isSelected,
+		"spiffy-tw-text-[--spiffy-colors-text-light]": isSelected,
+		"hover:spiffy-tw-bg-[--spiffy-colors-background-secondary-dark]": true,
+		"hover:spiffy-tw-text-[--spiffy-colors-text-primary]": isSelected,
+		"spiffy-tw-bg-[--spiffy-colors-background-light]": !isSelected,
+		"spiffy-tw-border-[--spiffy-colors-border-light]": !isSelected,
+		"spiffy-tw-text-[--spiffy-colors-text-primary]": !isSelected
+	}),
+	label: () => "",
+	secondaryLabel: ({ isSelected }) => (0, classnames.default)({
+		"spiffy-tw-text-[--spiffy-colors-text-secondary]": !isSelected,
+		"hover:spiffy-tw-text-[--spiffy-colors-text-secondary]": !isSelected
+	})
+} };
+const ToggleButton = ({ isSelected, onClick, label, buttonClassName, labelClassName, secondaryLabel, secondaryLabelClassName, icon, iconClassName, variant }) => {
+	const buttonClassNames = (0, classnames.default)({
+		"spiffy-tw-flex": true,
+		"spiffy-tw-items-center": true,
+		"spiffy-tw-gap-[4px]": true,
+		"spiffy-tw-cursor-pointer": true,
+		"spiffy-tw-py-[8px]": true,
+		"spiffy-tw-px-[12px]": true,
+		"spiffy-tw-rounded-[200px]": true,
+		"spiffy-tw-border": true
+	}, toggleButtonVariants?.[variant]?.button({ isSelected }), buttonClassName);
+	const labelClassNames = (0, classnames.default)({}, toggleButtonVariants?.[variant]?.label({ isSelected }), labelClassName);
+	const secondaryLabelClassNames = (0, classnames.default)({}, toggleButtonVariants?.[variant]?.secondaryLabel({ isSelected }), secondaryLabelClassName);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		className: buttonClassNames,
+		onClick,
+		type: "button",
+		children: [
+			icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: iconClassName,
+				children: icon
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+				variant: "body3",
+				className: labelClassNames,
+				children: label
+			}),
+			secondaryLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+				variant: "body4",
+				className: secondaryLabelClassNames,
+				children: secondaryLabel
+			})
+		]
+	});
+};
+
+//#endregion
+Object.defineProperty(exports, 'ToggleButton', {
+  enumerable: true,
+  get: function () {
+    return ToggleButton;
+  }
+});

package/dist/Typography/index.cjs

@@ -0,0 +1,6 @@
+const require_Typography = require('../Typography-CFNWgbM5.cjs');
+
+exports.Typography = require_Typography.Typography;
+exports.TypographyDomVariantMap = require_Typography.TypographyDomVariantMap;
+exports.TypographyVariantMap = require_Typography.TypographyVariantMap;
+exports.getVariantPlaceholderClassNames = require_Typography.getVariantPlaceholderClassNames;

package/dist/Typography/index.d.cts

@@ -0,0 +1,3 @@
+import { ElementTypes, TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames } from "../typographyVariantClasses-DTSltxPN.cjs";
+import { Typography, TypographyProps } from "../index-BMHF0IWd.cjs";
+export { ElementTypes, Typography, TypographyDomVariantMap, TypographyProps, TypographyVariantMap, getVariantPlaceholderClassNames };

package/dist/Typography/index.d.ts

@@ -0,0 +1,3 @@
+import { ElementTypes, TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames } from "../typographyVariantClasses-COmQXqcN.js";
+import { Typography, TypographyProps } from "../index-BH-QK27q.js";
+export { ElementTypes, Typography, TypographyDomVariantMap, TypographyProps, TypographyVariantMap, getVariantPlaceholderClassNames };

package/dist/Typography/index.js

@@ -0,0 +1,3 @@
+import { Typography, TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames } from "../Typography-D3vDkBMS.js";
+
+export { Typography, TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames };

package/dist/Typography-CFNWgbM5.cjs

@@ -0,0 +1,176 @@
+const require_chunk = require('./chunk-CUT6urMc.cjs');
+let react = require("react");
+react = require_chunk.__toESM(react);
+let classnames = require("classnames");
+classnames = require_chunk.__toESM(classnames);
+
+//#region src/components/Typography/typographyVariantClasses.ts
+const TypographyDomVariantMap = {
+	["h1"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[20px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[120%]": true
+	},
+	["h2"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-2": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["h3"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-3": true,
+		"spiffy-tw-text-[15px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["h4"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-4": true,
+		"spiffy-tw-text-[14px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	}
+};
+const TypographyVariantMap = {
+	...TypographyDomVariantMap,
+	["t1"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[32px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["t2"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["t3"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[24px]": true,
+		"spiffy-tw-leading-[120%]": true
+	},
+	["body1"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-1": true,
+		"spiffy-tw-text-[20px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-line-height-[120%]": true
+	},
+	["body2"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-2": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-line-height-[148%]": true
+	},
+	["body3"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-3": true,
+		"spiffy-tw-text-sm": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[140%]": true
+	},
+	["body4"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-4": true,
+		"spiffy-tw-text-xs": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[130%]": true
+	},
+	["body5"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-5": true,
+		"spiffy-tw-text-[10px]": true,
+		"spiffy-tw-font-normal": true
+	}
+};
+const getVariantPlaceholderClassNames = (classes) => Object.keys(classes).reduce((acc, key) => {
+	if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
+	else acc[`${key}-placeholder`] = classes[key];
+	return acc;
+}, {});
+
+//#endregion
+//#region src/components/Typography/util.ts
+const getElementTypeFromVariant = (variant, isHeadline) => {
+	if (isHeadline) return (TypographyDomVariantMap[variant] ? variant : null) || "h3";
+	return "span";
+};
+
+//#endregion
+//#region src/components/Typography/Typography.tsx
+const Typography = ({ children, className, style, noOfLines, testId, elementType, variant = "body3", id }) => {
+	const variantClassNames = variant ? TypographyVariantMap[variant] : {};
+	const isHeadline = (0, react.useCallback)(() => [
+		"t1",
+		"t2",
+		"t3",
+		"h1",
+		"h2",
+		"h3",
+		"h4"
+	].includes(variant), [variant]);
+	const renderedElementType = (0, react.useMemo)(() => {
+		if (elementType) return elementType;
+		if (!elementType) {
+			if (isHeadline()) return getElementTypeFromVariant(variant, isHeadline());
+		}
+		return "span";
+	}, [
+		isHeadline,
+		variant,
+		elementType
+	]);
+	const textClassNames = (0, classnames.default)(className, variantClassNames, {
+		"spiffy-tw-font-[Poppins,sans-serif]": isHeadline(),
+		"spiffy-tw-font-[\"Inter Variable,sans-serif\"]": !isHeadline(),
+		"spiffy-tw-line-clamp-1": noOfLines === 1,
+		"spiffy-tw-line-clamp-2": noOfLines === 2,
+		"spiffy-tw-line-clamp-3": noOfLines === 3,
+		"spiffy-tw-line-clamp-4": noOfLines === 4,
+		"spiffy-tw-line-clamp-5": noOfLines === 5,
+		"spiffy-tw-line-clamp-6": noOfLines === 6,
+		"spiffy-tw-line-clamp-7": noOfLines === 7
+	});
+	const renderElement = (elementTypeToRender) => react.default.createElement(elementTypeToRender, {
+		"data-testid": testId,
+		className: textClassNames,
+		style,
+		id
+	}, children);
+	return renderElement(renderedElementType);
+};
+
+//#endregion
+Object.defineProperty(exports, 'Typography', {
+  enumerable: true,
+  get: function () {
+    return Typography;
+  }
+});
+Object.defineProperty(exports, 'TypographyDomVariantMap', {
+  enumerable: true,
+  get: function () {
+    return TypographyDomVariantMap;
+  }
+});
+Object.defineProperty(exports, 'TypographyVariantMap', {
+  enumerable: true,
+  get: function () {
+    return TypographyVariantMap;
+  }
+});
+Object.defineProperty(exports, 'getVariantPlaceholderClassNames', {
+  enumerable: true,
+  get: function () {
+    return getVariantPlaceholderClassNames;
+  }
+});

package/dist/Typography-D3vDkBMS.js

@@ -0,0 +1,150 @@
+import React, { useCallback, useMemo } from "react";
+import classNames from "classnames";
+
+//#region src/components/Typography/typographyVariantClasses.ts
+const TypographyDomVariantMap = {
+	["h1"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[20px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[120%]": true
+	},
+	["h2"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-2": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["h3"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-3": true,
+		"spiffy-tw-text-[15px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["h4"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-4": true,
+		"spiffy-tw-text-[14px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	}
+};
+const TypographyVariantMap = {
+	...TypographyDomVariantMap,
+	["t1"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[32px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["t2"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[124%]": true
+	},
+	["t3"]: {
+		"spiffy-headline": true,
+		"spiffy-headline-1": true,
+		"spiffy-tw-text-[24px]": true,
+		"spiffy-tw-leading-[120%]": true
+	},
+	["body1"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-1": true,
+		"spiffy-tw-text-[20px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-line-height-[120%]": true
+	},
+	["body2"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-2": true,
+		"spiffy-tw-text-[16px]": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-line-height-[148%]": true
+	},
+	["body3"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-3": true,
+		"spiffy-tw-text-sm": true,
+		"spiffy-tw-font-normal": true,
+		"spiffy-tw-leading-[140%]": true
+	},
+	["body4"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-4": true,
+		"spiffy-tw-text-xs": true,
+		"spiffy-tw-font-medium": true,
+		"spiffy-tw-leading-[130%]": true
+	},
+	["body5"]: {
+		"spiffy-body-text": true,
+		"spiffy-body-5": true,
+		"spiffy-tw-text-[10px]": true,
+		"spiffy-tw-font-normal": true
+	}
+};
+const getVariantPlaceholderClassNames = (classes) => Object.keys(classes).reduce((acc, key) => {
+	if (key.includes("spiffy-tw")) acc[`placeholder:${key}`] = classes[key];
+	else acc[`${key}-placeholder`] = classes[key];
+	return acc;
+}, {});
+
+//#endregion
+//#region src/components/Typography/util.ts
+const getElementTypeFromVariant = (variant, isHeadline) => {
+	if (isHeadline) return (TypographyDomVariantMap[variant] ? variant : null) || "h3";
+	return "span";
+};
+
+//#endregion
+//#region src/components/Typography/Typography.tsx
+const Typography = ({ children, className, style, noOfLines, testId, elementType, variant = "body3", id }) => {
+	const variantClassNames = variant ? TypographyVariantMap[variant] : {};
+	const isHeadline = useCallback(() => [
+		"t1",
+		"t2",
+		"t3",
+		"h1",
+		"h2",
+		"h3",
+		"h4"
+	].includes(variant), [variant]);
+	const renderedElementType = useMemo(() => {
+		if (elementType) return elementType;
+		if (!elementType) {
+			if (isHeadline()) return getElementTypeFromVariant(variant, isHeadline());
+		}
+		return "span";
+	}, [
+		isHeadline,
+		variant,
+		elementType
+	]);
+	const textClassNames = classNames(className, variantClassNames, {
+		"spiffy-tw-font-[Poppins,sans-serif]": isHeadline(),
+		"spiffy-tw-font-[\"Inter Variable,sans-serif\"]": !isHeadline(),
+		"spiffy-tw-line-clamp-1": noOfLines === 1,
+		"spiffy-tw-line-clamp-2": noOfLines === 2,
+		"spiffy-tw-line-clamp-3": noOfLines === 3,
+		"spiffy-tw-line-clamp-4": noOfLines === 4,
+		"spiffy-tw-line-clamp-5": noOfLines === 5,
+		"spiffy-tw-line-clamp-6": noOfLines === 6,
+		"spiffy-tw-line-clamp-7": noOfLines === 7
+	});
+	const renderElement = (elementTypeToRender) => React.createElement(elementTypeToRender, {
+		"data-testid": testId,
+		className: textClassNames,
+		style,
+		id
+	}, children);
+	return renderElement(renderedElementType);
+};
+
+//#endregion
+export { Typography, TypographyDomVariantMap, TypographyVariantMap, getVariantPlaceholderClassNames };

package/dist/chunk-CUT6urMc.cjs

@@ -0,0 +1,30 @@
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+
+Object.defineProperty(exports, '__toESM', {
+  enumerable: true,
+  get: function () {
+    return __toESM;
+  }
+});

package/dist/colorsConfig-D-MZuBvt.cjs

@@ -0,0 +1,38 @@
+
+//#region src/models/colorsConfig.ts
+var ColorNames = /* @__PURE__ */ function(ColorNames$1) {
+	ColorNames$1["TextPrimary"] = "text-primary";
+	ColorNames$1["TextSecondary"] = "text-secondary";
+	ColorNames$1["TextAccent"] = "text-accent";
+	ColorNames$1["TextLink"] = "text-link";
+	ColorNames$1["TextLight"] = "text-light";
+	ColorNames$1["BackgroundPrimary"] = "background-primary";
+	ColorNames$1["BackgroundSecondary"] = "background-secondary";
+	ColorNames$1["BackgroundSecondaryDark"] = "background-secondary-dark";
+	ColorNames$1["BackgroundTertiary"] = "background-tertiary";
+	ColorNames$1["BackgroundDark"] = "background-dark";
+	ColorNames$1["BackgroundLight"] = "background-light";
+	ColorNames$1["BackgroundSaturated"] = "background-saturated";
+	ColorNames$1["BorderLight"] = "border-light";
+	ColorNames$1["BorderMedium"] = "border-medium";
+	ColorNames$1["BorderDark"] = "border-dark";
+	ColorNames$1["BorderOutline"] = "border-outline";
+	ColorNames$1["AccentPrimary"] = "accent-primary";
+	ColorNames$1["AccentSecondary"] = "accent-secondary";
+	return ColorNames$1;
+}(ColorNames || {});
+const colorVar = (color) => `var(--spiffy-colors-${color})`;
+
+//#endregion
+Object.defineProperty(exports, 'ColorNames', {
+  enumerable: true,
+  get: function () {
+    return ColorNames;
+  }
+});
+Object.defineProperty(exports, 'colorVar', {
+  enumerable: true,
+  get: function () {
+    return colorVar;
+  }
+});

package/dist/colorsConfig-DEfiLHH0.js

@@ -0,0 +1,26 @@
+//#region src/models/colorsConfig.ts
+var ColorNames = /* @__PURE__ */ function(ColorNames$1) {
+	ColorNames$1["TextPrimary"] = "text-primary";
+	ColorNames$1["TextSecondary"] = "text-secondary";
+	ColorNames$1["TextAccent"] = "text-accent";
+	ColorNames$1["TextLink"] = "text-link";
+	ColorNames$1["TextLight"] = "text-light";
+	ColorNames$1["BackgroundPrimary"] = "background-primary";
+	ColorNames$1["BackgroundSecondary"] = "background-secondary";
+	ColorNames$1["BackgroundSecondaryDark"] = "background-secondary-dark";
+	ColorNames$1["BackgroundTertiary"] = "background-tertiary";
+	ColorNames$1["BackgroundDark"] = "background-dark";
+	ColorNames$1["BackgroundLight"] = "background-light";
+	ColorNames$1["BackgroundSaturated"] = "background-saturated";
+	ColorNames$1["BorderLight"] = "border-light";
+	ColorNames$1["BorderMedium"] = "border-medium";
+	ColorNames$1["BorderDark"] = "border-dark";
+	ColorNames$1["BorderOutline"] = "border-outline";
+	ColorNames$1["AccentPrimary"] = "accent-primary";
+	ColorNames$1["AccentSecondary"] = "accent-secondary";
+	return ColorNames$1;
+}(ColorNames || {});
+const colorVar = (color) => `var(--spiffy-colors-${color})`;
+
+//#endregion
+export { ColorNames, colorVar };

package/dist/index-B-5pBFE7.d.cts

@@ -0,0 +1,46 @@
+import * as react_jsx_runtime15 from "react/jsx-runtime";
+import { SearchFilterDatum, SelectFilterItem } from "@envive-ai/react-hooks/types";
+
+//#region src/components/SearchResultsFilterSidebar/types.d.ts
+type SearchFilterSidebarVariant = 'darkButton' | 'lightButton';
+type CloseIconVariant$1 = 'light' | 'tertiary' | 'dark';
+//#endregion
+//#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.d.ts
+interface SearchFilterSidebarVariantClasses {
+  searchFilterHeaderClasses: string;
+  radioButtonFillColor: string;
+  radioButtonHoverColor: string;
+  radioButtonUncheckedBorderColor: string;
+  filterDefaultClasses: string;
+  filterActiveClasses: string;
+  filterHoverClasses: string;
+  appliedFilterBackgroundClasses: string;
+  applyFiltersUnchangedClasses: string;
+  applyFiltersChangedClasses: string;
+  filterCloseIconVariant: CloseIconVariant$1;
+}
+declare const searchFilterSidebarVariantClasses: Record<SearchFilterSidebarVariant, SearchFilterSidebarVariantClasses>;
+//#endregion
+//#region src/components/SearchResultsFilterSidebar/SearchResultsFilter.d.ts
+type SearchResultsFilterProps = {
+  productCount: number;
+  isOpen: boolean;
+  setIsOpen: (isOpen: boolean) => void;
+  searchFilters: SearchFilterDatum[];
+  searchFilterSidebarVariant: SearchFilterSidebarVariant;
+  onSelectFilterItem: SelectFilterItem;
+  onClearAllFilters: () => void;
+  filterButtonText: string;
+};
+declare const SearchResultsFilter: ({
+  productCount,
+  isOpen,
+  setIsOpen,
+  searchFilters,
+  searchFilterSidebarVariant,
+  onSelectFilterItem,
+  onClearAllFilters,
+  filterButtonText
+}: SearchResultsFilterProps) => react_jsx_runtime15.JSX.Element;
+//#endregion
+export { CloseIconVariant$1 as CloseIconVariant, SearchFilterSidebarVariant, SearchResultsFilter, SearchResultsFilterProps, searchFilterSidebarVariantClasses };