@envive-ai/react-toolkit 0.1.9 → 0.1.11

package/dist/Styles/index.d.ts

@@ -0,0 +1,258 @@
+import typography from "@tailwindcss/typography";
+
+//#region src/components/Styles/EnviveTailwindPreset.d.ts
+
+/**
+ * Helper function to create content paths for the Envive React Toolkit
+ * This should be used in the consuming application's tailwind.config.js
+ *
+ * @param additionalPaths - Additional content paths to include
+ * @returns Array of content paths including the toolkit components
+ */
+declare const createEnviveContentPaths: (additionalPaths?: string[]) => string[];
+/** @type {import('tailwindcss').Config} */
+declare const EnviveTailwindPreset: {
+  future: {
+    hoverOnlyWhenSupported: boolean;
+  };
+  prefix: string;
+  theme: {
+    screens: {
+      sm: string;
+      md: string;
+      lg: string;
+      xl: string;
+    };
+    fontFamily: {
+      sans: string[];
+    };
+    fontSize: {
+      xs: string;
+      sm: string;
+      md: string;
+      lg: string;
+      xl: string;
+    };
+    fontWeight: {
+      normal: number;
+      medium: number;
+      semibold: number;
+      bold: number;
+    };
+    spacing: {
+      px: string;
+      0.5: string;
+      1: string;
+      1.5: string;
+      2: string;
+      2.5: string;
+      3: string;
+      3.5: string;
+      4: string;
+      5: string;
+      6: string;
+      7: string;
+      8: string;
+      9: string;
+      10: string;
+      12: string;
+      14: string;
+      16: string;
+      20: string;
+      24: string;
+      28: string;
+      32: string;
+      36: string;
+      40: string;
+      44: string;
+      48: string;
+      52: string;
+      56: string;
+      60: string;
+      64: string;
+      72: string;
+      80: string;
+      96: string;
+    };
+    borderRadius: {
+      none: string;
+      sm: string;
+      base: string;
+      md: string;
+      lg: string;
+      xl: string;
+      '2xl': string;
+      '3xl': string;
+      full: string;
+    };
+    extend: {
+      keyframes: {
+        pulse: {
+          '0%': {
+            borderColor: string;
+            background: string;
+          };
+          '50%': {};
+          '100%': {
+            borderColor: string;
+            background: string;
+          };
+        };
+        ellipse_162_1_flow_1: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_162_1_flow_2: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_162_1_flow_5: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_162_1_flow_6: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_163_2_flow_2: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_163_2_flow_3: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_163_2_flow_6: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_163_2_flow_7: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_164_3_flow_3: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_164_3_flow_4: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_164_3_flow_7: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+        ellipse_164_3_flow_8: {
+          from: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+          to: {
+            transform: string;
+            transformOrigin: string;
+            cy: string;
+          };
+        };
+      };
+      animation: {
+        pulse: string;
+        'ellipse-1-complete': string;
+        'ellipse-2-complete': string;
+        'ellipse-3-complete': string;
+      };
+    };
+  };
+  content: string[][];
+  plugins: (typeof typography)[];
+};
+//#endregion
+export { EnviveTailwindPreset, createEnviveContentPaths, EnviveTailwindPreset as default };

package/dist/Styles/index.js

@@ -0,0 +1,274 @@
+import { createRequire } from "node:module";
+import typography from "@tailwindcss/typography";
+
+//#region rolldown:runtime
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+
+//#endregion
+//#region src/components/Styles/EnviveTailwindPreset.ts
+/**
+* Helper function to create content paths for the Envive React Toolkit
+* This should be used in the consuming application's tailwind.config.js
+*
+* @param additionalPaths - Additional content paths to include
+* @returns Array of content paths including the toolkit components
+*/
+const createEnviveContentPaths = (additionalPaths = []) => {
+	let toolkitPath;
+	try {
+		if (typeof __require !== "undefined" && typeof __require.resolve === "function") {
+			const path = __require("path");
+			toolkitPath = path.join(path.dirname(__require.resolve("@envive-ai/react-toolkit/package.json")), "dist/**/*.{js,cjs}");
+		} else toolkitPath = "./node_modules/@envive-ai/react-toolkit/dist/**/*.{js,cjs}";
+	} catch {
+		toolkitPath = "./node_modules/@envive-ai/react-toolkit/dist/**/*.{js,cjs}";
+	}
+	return [toolkitPath, ...additionalPaths];
+};
+/** @type {import('tailwindcss').Config} */
+const EnviveTailwindPreset = {
+	future: { hoverOnlyWhenSupported: true },
+	prefix: "spiffy-tw-",
+	theme: {
+		screens: {
+			sm: "480px",
+			md: "768px",
+			lg: "976px",
+			xl: "1440px"
+		},
+		fontFamily: { sans: [
+			"Inter Variable",
+			"Poppins",
+			"sans-serif"
+		] },
+		fontSize: {
+			xs: "12px",
+			sm: "14px",
+			md: "16px",
+			lg: "18px",
+			xl: "20px"
+		},
+		fontWeight: {
+			normal: 400,
+			medium: 500,
+			semibold: 600,
+			bold: 700
+		},
+		spacing: {
+			px: "1px",
+			.5: "2px",
+			1: "4px",
+			1.5: "6px",
+			2: "8px",
+			2.5: "10px",
+			3: "12px",
+			3.5: "14px",
+			4: "16px",
+			5: "20px",
+			6: "24px",
+			7: "28px",
+			8: "32px",
+			9: "36px",
+			10: "40px",
+			12: "48px",
+			14: "56px",
+			16: "64px",
+			20: "80px",
+			24: "96px",
+			28: "112px",
+			32: "128px",
+			36: "144px",
+			40: "160px",
+			44: "176px",
+			48: "192px",
+			52: "208px",
+			56: "224px",
+			60: "240px",
+			64: "256px",
+			72: "288px",
+			80: "320px",
+			96: "384px"
+		},
+		borderRadius: {
+			none: "0",
+			sm: "2px",
+			base: "4px",
+			md: "6px",
+			lg: "8px",
+			xl: "12px",
+			"2xl": "16px",
+			"3xl": "24px",
+			full: "9999px"
+		},
+		extend: {
+			keyframes: {
+				pulse: {
+					"0%": {
+						borderColor: "#EDF2F7",
+						background: "#EDF2F7"
+					},
+					"50%": {},
+					"100%": {
+						borderColor: "#A0AEC0",
+						background: "#A0AEC0"
+					}
+				},
+				ellipse_162_1_flow_1: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_162_1_flow_2: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 9.5px",
+						cy: "9.5px"
+					}
+				},
+				ellipse_162_1_flow_5: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_162_1_flow_6: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "8.5px 9.5px",
+						cy: "9.5px"
+					}
+				},
+				ellipse_163_2_flow_2: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_163_2_flow_3: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 9.5px",
+						cy: "9.5px"
+					}
+				},
+				ellipse_163_2_flow_6: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_163_2_flow_7: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "16.5px 9.5px",
+						cy: "9.5px"
+					}
+				},
+				ellipse_164_3_flow_3: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_164_3_flow_4: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 9.5px",
+						cy: "9.5px"
+					}
+				},
+				ellipse_164_3_flow_7: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 9.5px",
+						cy: "9.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 7.5px",
+						cy: "7.5px"
+					}
+				},
+				ellipse_164_3_flow_8: {
+					from: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 7.5px",
+						cy: "7.5px"
+					},
+					to: {
+						transform: "translate(0px, 0px) rotate(0deg)",
+						transformOrigin: "24.5px 9.5px",
+						cy: "9.5px"
+					}
+				}
+			},
+			animation: {
+				pulse: "pulse 0.8s linear infinite alternate",
+				"ellipse-1-complete": "ellipse_162_1_flow_1 0.3s ease-out 0s forwards, ellipse_162_1_flow_2 0.2s ease-out 0.3s forwards, ellipse_162_1_flow_5 0.2s ease-out 0.91s forwards, ellipse_162_1_flow_6 0.2s ease-out 1.11s forwards",
+				"ellipse-2-complete": "ellipse_163_2_flow_2 0.2s ease-out 0.3s forwards, ellipse_163_2_flow_3 0.2s ease-out 0.5s forwards, ellipse_163_2_flow_6 0.2s ease-out 1.11s forwards, ellipse_163_2_flow_7 0.2s ease-out 1.31s forwards",
+				"ellipse-3-complete": "ellipse_164_3_flow_3 0.2s ease-out 0.5s forwards, ellipse_164_3_flow_4 0.2s ease-out 0.7s forwards, ellipse_164_3_flow_7 0.2s ease-out 1.31s forwards, ellipse_164_3_flow_8 0.2s ease-out 1.51s forwards"
+			}
+		}
+	},
+	content: [createEnviveContentPaths(["./index.html", "./src/**/*.{js,ts,jsx,tsx}"])],
+	plugins: [typography]
+};
+
+//#endregion
+export { EnviveTailwindPreset, createEnviveContentPaths, EnviveTailwindPreset as default };

package/dist/SuggestionButton/index.cjs

@@ -1,7 +1,7 @@
 const require_chunk = require('../chunk-CUT6urMc.cjs');
 require('../textVariantClasses-Dgz7Zaql.cjs');
 require('../Text-MQjxqgZZ.cjs');
-const require_ButtonBase = require('../ButtonBase-DGpQBeLR.cjs');
+const require_ButtonBase = require('../ButtonBase-Do88ndKa.cjs');
 let classnames = require("classnames");
 classnames = require_chunk.__toESM(classnames);
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/SuggestionButton/index.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime24 from "react/jsx-runtime";
 import { TestProps } from "@envive-ai/react-hooks/types";
 
 //#region src/components/SuggestionButton/types.d.ts
@@ -30,6 +30,6 @@ declare const SuggestionButton: ({
   dataAttributes,
   dataTestId,
   onClick
-}: SuggestionButtonProps) => react_jsx_runtime15.JSX.Element;
+}: SuggestionButtonProps) => react_jsx_runtime24.JSX.Element;
 //#endregion
 export { SPIFFY_SUGGESTION_BUTTON_ANSWER_CLASS, SPIFFY_SUGGESTION_BUTTON_QUESTION_CLASS, SPIFFY_SUGGESTION_BUTTON_TEXT_CLASS, SuggestionButton, SuggestionButtonVariant };

package/dist/SuggestionButton/index.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime23 from "react/jsx-runtime";
+import * as react_jsx_runtime24 from "react/jsx-runtime";
 import { TestProps } from "@envive-ai/react-hooks/types";
 
 //#region src/components/SuggestionButton/types.d.ts
@@ -30,6 +30,6 @@ declare const SuggestionButton: ({
   dataAttributes,
   dataTestId,
   onClick
-}: SuggestionButtonProps) => react_jsx_runtime23.JSX.Element;
+}: SuggestionButtonProps) => react_jsx_runtime24.JSX.Element;
 //#endregion
 export { SPIFFY_SUGGESTION_BUTTON_ANSWER_CLASS, SPIFFY_SUGGESTION_BUTTON_QUESTION_CLASS, SPIFFY_SUGGESTION_BUTTON_TEXT_CLASS, SuggestionButton, SuggestionButtonVariant };

package/dist/SuggestionButton/index.js

@@ -1,6 +1,6 @@
 import "../textVariantClasses-D77TGEy1.js";
 import "../Text-Bod4OMPk.js";
-import { ButtonBase } from "../ButtonBase-DGbSm0SJ.js";
+import { ButtonBase } from "../ButtonBase-BAf-nlCm.js";
 import classNames from "classnames";
 import { jsx } from "react/jsx-runtime";
 import OutlinedStar from "@envive-ai/react-icons/OutlinedStar";

package/dist/Text/index.d.cts

@@ -1,5 +1,5 @@
 import { HeadlineVariantMap, TextStyleVariantMap, TextVariantMap, getVariantPlaceholderClassNames } from "../textVariantClasses-B0gNjzl4.cjs";
-import * as react_jsx_runtime19 from "react/jsx-runtime";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 
 //#region src/components/Text/types.d.ts
 declare enum ExpandableTextOverrides {
@@ -37,6 +37,6 @@ declare const Text: ({
   testId,
   type,
   variant
-}: TextProps) => react_jsx_runtime19.JSX.Element;
+}: TextProps) => react_jsx_runtime12.JSX.Element;
 //#endregion
 export { ExpandableTextOverrides, HeadlineProps, HeadlineVariant, HeadlineVariantMap, Text, TextStyleVariantMap, TextType, TextVariant, TextVariantMap, getVariantPlaceholderClassNames };

package/dist/Text/index.d.ts

@@ -1,5 +1,5 @@
-import { HeadlineVariantMap, TextStyleVariantMap, TextVariantMap, getVariantPlaceholderClassNames } from "../textVariantClasses-ypYGLq0h.js";
-import * as react_jsx_runtime22 from "react/jsx-runtime";
+import { HeadlineVariantMap, TextStyleVariantMap, TextVariantMap, getVariantPlaceholderClassNames } from "../textVariantClasses-kyZtL8F5.js";
+import * as react_jsx_runtime23 from "react/jsx-runtime";
 
 //#region src/components/Text/types.d.ts
 declare enum ExpandableTextOverrides {
@@ -37,6 +37,6 @@ declare const Text: ({
   testId,
   type,
   variant
-}: TextProps) => react_jsx_runtime22.JSX.Element;
+}: TextProps) => react_jsx_runtime23.JSX.Element;
 //#endregion
 export { ExpandableTextOverrides, HeadlineProps, HeadlineVariant, HeadlineVariantMap, Text, TextStyleVariantMap, TextType, TextVariant, TextVariantMap, getVariantPlaceholderClassNames };

package/dist/TextInput/index.cjs

@@ -1,4 +1,4 @@
 require('../textVariantClasses-Dgz7Zaql.cjs');
-const require_TextInput = require('../TextInput-DLSgpP6b.cjs');
+const require_TextInput = require('../TextInput-CnXhppYn.cjs');
 
 exports.TextInput = require_TextInput.TextInput;

package/dist/TextInput/index.d.ts

@@ -1,4 +1,4 @@
-import { TextStyleVariantMap } from "../textVariantClasses-ypYGLq0h.js";
+import { TextStyleVariantMap } from "../textVariantClasses-kyZtL8F5.js";
 import React from "react";
 
 //#region src/components/TextInput/TextInput.d.ts

package/dist/TextInput/index.js

@@ -1,4 +1,4 @@
 import "../textVariantClasses-D77TGEy1.js";
-import { TextInput } from "../TextInput-BFPXhSAY.js";
+import { TextInput } from "../TextInput-BVPdz7e8.js";
 
 export { TextInput };

package/dist/ToggleButton/index.cjs

@@ -0,0 +1,6 @@
+require('../textVariantClasses-Dgz7Zaql.cjs');
+require('../Text-MQjxqgZZ.cjs');
+require('../Text-C8t_iEj6.cjs');
+const require_ToggleButton = require('../ToggleButton-D90UO4qv.cjs');
+
+exports.ToggleButton = require_ToggleButton.ToggleButton;

package/dist/ToggleButton/index.d.cts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime18 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_runtime18.JSX.Element;
+//#endregion
+export { ToggleButton, ToggleButtonProps, ToggleButtonVariant };

package/dist/ToggleButton/index.d.ts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime7 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_runtime7.JSX.Element;
+//#endregion
+export { ToggleButton, ToggleButtonProps, ToggleButtonVariant };