@fragments-sdk/ui 0.9.0 → 0.9.2

package/dist/components/ThinkingIndicator/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/ThinkingIndicator/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './ThinkingIndicator.module.scss';\nimport { Loading } from '../Loading';\n\n// ============================================\n// Types\n// ============================================\n\nexport type ThinkingVariant = 'dots' | 'pulse' | 'spinner';\nexport type StepStatus = 'pending' | 'active' | 'complete' | 'error';\n\nexport interface ThinkingStep {\n  id: string;\n  label: string;\n  status?: StepStatus;\n}\n\nexport interface ThinkingIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Whether thinking is active */\n  active?: boolean;\n  /** Status text */\n  label?: string;\n  /** Animation style */\n  variant?: ThinkingVariant;\n  /** Show elapsed time */\n  showElapsed?: boolean;\n  /** Multi-step progress */\n  steps?: ThinkingStep[];\n}\n\nexport interface ThinkingStepsProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\nexport interface ThinkingStepProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Step label */\n  label: string;\n  /** Step status */\n  status?: StepStatus;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface ThinkingIndicatorContextValue {\n  active: boolean;\n  variant: ThinkingVariant;\n}\n\nconst ThinkingIndicatorContext = React.createContext<ThinkingIndicatorContextValue | null>(null);\n\nfunction useThinkingIndicatorContext() {\n  const context = React.useContext(ThinkingIndicatorContext);\n  if (!context) {\n    throw new Error('ThinkingIndicator compound components must be used within a ThinkingIndicator');\n  }\n  return context;\n}\n\n// ============================================\n// Hooks\n// ============================================\n\nfunction useElapsedTime(active: boolean): string {\n  const [elapsed, setElapsed] = React.useState(0);\n  const startTimeRef = React.useRef<number>(Date.now());\n\n  React.useEffect(() => {\n    if (!active) {\n      setElapsed(0);\n      return;\n    }\n\n    startTimeRef.current = Date.now();\n    const interval = setInterval(() => {\n      setElapsed(Date.now() - startTimeRef.current);\n    }, 1000);\n\n    return () => clearInterval(interval);\n  }, [active]);\n\n  if (elapsed < 1000) return '';\n\n  const seconds = Math.floor(elapsed / 1000);\n  if (seconds < 60) return `${seconds}s`;\n\n  const minutes = Math.floor(seconds / 60);\n  const remainingSeconds = seconds % 60;\n  return `${minutes}m ${remainingSeconds}s`;\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction CheckIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <polyline points=\"20 6 9 17 4 12\" />\n    </svg>\n  );\n}\n\nfunction ErrorIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n}\n\n// ============================================\n// Sub-components\n// ============================================\n\nfunction ThinkingSteps({ children, className, ...htmlProps }: ThinkingStepsProps) {\n  const classes = [styles.steps, className].filter(Boolean).join(' ');\n\n  return (\n    <div {...htmlProps} className={classes}>\n      {children}\n    </div>\n  );\n}\n\nfunction ThinkingStep({\n  label,\n  status = 'pending',\n  className,\n  ...htmlProps\n}: ThinkingStepProps) {\n  const classes = [\n    styles.step,\n    styles[`step${status.charAt(0).toUpperCase() + status.slice(1)}`],\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div {...htmlProps} className={classes}>\n      <span className={styles.stepIndicator}>\n        {status === 'complete' && <CheckIcon />}\n        {status === 'error' && <ErrorIcon />}\n        {status === 'active' && <Loading size=\"sm\" variant=\"spinner\" color=\"current\" label=\"\" />}\n        {status === 'pending' && <span className={styles.stepDot} />}\n      </span>\n      <span className={styles.stepLabel}>{label}</span>\n    </div>\n  );\n}\n\n// ============================================\n// Main Component\n// ============================================\n\nfunction ThinkingIndicatorRoot({\n  active = true,\n  label = 'Thinking...',\n  variant = 'dots',\n  showElapsed = false,\n  steps,\n  className,\n  ...htmlProps\n}: ThinkingIndicatorProps) {\n  const elapsedTime = useElapsedTime(active && showElapsed);\n\n  const contextValue: ThinkingIndicatorContextValue = {\n    active,\n    variant,\n  };\n\n  if (!active) return null;\n\n  const classes = [\n    styles.thinkingIndicator,\n    className,\n  ].filter(Boolean).join(' ');\n\n  // Map ThinkingIndicator variants to Loading variants\n  const loadingVariant = variant === 'dots' ? 'dots'\n    : variant === 'pulse' ? 'pulse'\n    : 'spinner';\n\n  return (\n    <ThinkingIndicatorContext.Provider value={contextValue}>\n      <div\n        {...htmlProps}\n        className={classes}\n        role=\"status\"\n        aria-label={label}\n        aria-live=\"polite\"\n      >\n        <div className={styles.main}>\n          <Loading size=\"sm\" variant={loadingVariant} color=\"muted\" label=\"\" />\n          <span className={styles.label}>{label}</span>\n          {showElapsed && elapsedTime && (\n            <span className={styles.elapsed}>{elapsedTime}</span>\n          )}\n        </div>\n\n        {steps && steps.length > 0 && (\n          <ThinkingSteps>\n            {steps.map((step) => (\n              <ThinkingStep\n                key={step.id}\n                label={step.label}\n                status={step.status}\n              />\n            ))}\n          </ThinkingSteps>\n        )}\n      </div>\n    </ThinkingIndicatorContext.Provider>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const ThinkingIndicator = Object.assign(ThinkingIndicatorRoot, {\n  Steps: ThinkingSteps,\n  Step: ThinkingStep,\n});\n\nexport {\n  ThinkingIndicatorRoot,\n  ThinkingSteps,\n  ThinkingStep,\n};\n\nexport { useThinkingIndicatorContext };\n"],"names":["React","jsx","jsxs","styles","Loading"],"mappings":"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"}

package/dist/components/ThinkingIndicator/index.d.ts

@@ -0,0 +1,44 @@
+import * as React from 'react';
+export type ThinkingVariant = 'dots' | 'pulse' | 'spinner';
+export type StepStatus = 'pending' | 'active' | 'complete' | 'error';
+export interface ThinkingStep {
+    id: string;
+    label: string;
+    status?: StepStatus;
+}
+export interface ThinkingIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Whether thinking is active */
+    active?: boolean;
+    /** Status text */
+    label?: string;
+    /** Animation style */
+    variant?: ThinkingVariant;
+    /** Show elapsed time */
+    showElapsed?: boolean;
+    /** Multi-step progress */
+    steps?: ThinkingStep[];
+}
+export interface ThinkingStepsProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode;
+}
+export interface ThinkingStepProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Step label */
+    label: string;
+    /** Step status */
+    status?: StepStatus;
+}
+interface ThinkingIndicatorContextValue {
+    active: boolean;
+    variant: ThinkingVariant;
+}
+declare function useThinkingIndicatorContext(): ThinkingIndicatorContextValue;
+declare function ThinkingSteps({ children, className, ...htmlProps }: ThinkingStepsProps): import("react/jsx-runtime").JSX.Element;
+declare function ThinkingStep({ label, status, className, ...htmlProps }: ThinkingStepProps): import("react/jsx-runtime").JSX.Element;
+declare function ThinkingIndicatorRoot({ active, label, variant, showElapsed, steps, className, ...htmlProps }: ThinkingIndicatorProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const ThinkingIndicator: typeof ThinkingIndicatorRoot & {
+    Steps: typeof ThinkingSteps;
+    Step: typeof ThinkingStep;
+};
+export { ThinkingIndicatorRoot, ThinkingSteps, ThinkingStep, };
+export { useThinkingIndicatorContext };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ThinkingIndicator/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ThinkingIndicator/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;AAC3D,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,CAAC;AAErE,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB;AAED,MAAM,WAAW,sBAAuB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAClF,iCAAiC;IACjC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sBAAsB;IACtB,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0BAA0B;IAC1B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;CACxB;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB;AAMD,UAAU,6BAA6B;IACrC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,eAAe,CAAC;CAC1B;AAID,iBAAS,2BAA2B,kCAMnC;AAiFD,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,kBAAkB,2CAQ/E;AAED,iBAAS,YAAY,CAAC,EACpB,KAAK,EACL,MAAkB,EAClB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,iBAAiB,2CAkBnB;AAMD,iBAAS,qBAAqB,CAAC,EAC7B,MAAa,EACb,KAAqB,EACrB,OAAgB,EAChB,WAAmB,EACnB,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACb,EAAE,sBAAsB,kDAmDxB;AAMD,eAAO,MAAM,iBAAiB;;;CAG5B,CAAC;AAEH,OAAO,EACL,qBAAqB,EACrB,aAAa,EACb,YAAY,GACb,CAAC;AAEF,OAAO,EAAE,2BAA2B,EAAE,CAAC"}

package/dist/components/ThinkingIndicator/index.js

@@ -0,0 +1,155 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./ThinkingIndicator.module.scss.js";
+import { Loading } from "../Loading/index.js";
+const ThinkingIndicatorContext = React.createContext(null);
+function useThinkingIndicatorContext() {
+  const context = React.useContext(ThinkingIndicatorContext);
+  if (!context) {
+    throw new Error("ThinkingIndicator compound components must be used within a ThinkingIndicator");
+  }
+  return context;
+}
+function useElapsedTime(active) {
+  const [elapsed, setElapsed] = React.useState(0);
+  const startTimeRef = React.useRef(Date.now());
+  React.useEffect(() => {
+    if (!active) {
+      setElapsed(0);
+      return;
+    }
+    startTimeRef.current = Date.now();
+    const interval = setInterval(() => {
+      setElapsed(Date.now() - startTimeRef.current);
+    }, 1e3);
+    return () => clearInterval(interval);
+  }, [active]);
+  if (elapsed < 1e3) return "";
+  const seconds = Math.floor(elapsed / 1e3);
+  if (seconds < 60) return `${seconds}s`;
+  const minutes = Math.floor(seconds / 60);
+  const remainingSeconds = seconds % 60;
+  return `${minutes}m ${remainingSeconds}s`;
+}
+function CheckIcon() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
+    }
+  );
+}
+function ErrorIcon() {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+        /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+      ]
+    }
+  );
+}
+function ThinkingSteps({ children, className, ...htmlProps }) {
+  const classes = [styles.steps, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("div", { ...htmlProps, className: classes, children });
+}
+function ThinkingStep({
+  label,
+  status = "pending",
+  className,
+  ...htmlProps
+}) {
+  const classes = [
+    styles.step,
+    styles[`step${status.charAt(0).toUpperCase() + status.slice(1)}`],
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { ...htmlProps, className: classes, children: [
+    /* @__PURE__ */ jsxs("span", { className: styles.stepIndicator, children: [
+      status === "complete" && /* @__PURE__ */ jsx(CheckIcon, {}),
+      status === "error" && /* @__PURE__ */ jsx(ErrorIcon, {}),
+      status === "active" && /* @__PURE__ */ jsx(Loading, { size: "sm", variant: "spinner", color: "current", label: "" }),
+      status === "pending" && /* @__PURE__ */ jsx("span", { className: styles.stepDot })
+    ] }),
+    /* @__PURE__ */ jsx("span", { className: styles.stepLabel, children: label })
+  ] });
+}
+function ThinkingIndicatorRoot({
+  active = true,
+  label = "Thinking...",
+  variant = "dots",
+  showElapsed = false,
+  steps,
+  className,
+  ...htmlProps
+}) {
+  const elapsedTime = useElapsedTime(active && showElapsed);
+  const contextValue = {
+    active,
+    variant
+  };
+  if (!active) return null;
+  const classes = [
+    styles.thinkingIndicator,
+    className
+  ].filter(Boolean).join(" ");
+  const loadingVariant = variant === "dots" ? "dots" : variant === "pulse" ? "pulse" : "spinner";
+  return /* @__PURE__ */ jsx(ThinkingIndicatorContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...htmlProps,
+      className: classes,
+      role: "status",
+      "aria-label": label,
+      "aria-live": "polite",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: styles.main, children: [
+          /* @__PURE__ */ jsx(Loading, { size: "sm", variant: loadingVariant, color: "muted", label: "" }),
+          /* @__PURE__ */ jsx("span", { className: styles.label, children: label }),
+          showElapsed && elapsedTime && /* @__PURE__ */ jsx("span", { className: styles.elapsed, children: elapsedTime })
+        ] }),
+        steps && steps.length > 0 && /* @__PURE__ */ jsx(ThinkingSteps, { children: steps.map((step) => /* @__PURE__ */ jsx(
+          ThinkingStep,
+          {
+            label: step.label,
+            status: step.status
+          },
+          step.id
+        )) })
+      ]
+    }
+  ) });
+}
+const ThinkingIndicator = Object.assign(ThinkingIndicatorRoot, {
+  Steps: ThinkingSteps,
+  Step: ThinkingStep
+});
+export {
+  ThinkingIndicator,
+  ThinkingIndicatorRoot,
+  ThinkingStep,
+  ThinkingSteps,
+  useThinkingIndicatorContext
+};
+//# sourceMappingURL=index.js.map

package/dist/components/ThinkingIndicator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/ThinkingIndicator/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './ThinkingIndicator.module.scss';\nimport { Loading } from '../Loading';\n\n// ============================================\n// Types\n// ============================================\n\nexport type ThinkingVariant = 'dots' | 'pulse' | 'spinner';\nexport type StepStatus = 'pending' | 'active' | 'complete' | 'error';\n\nexport interface ThinkingStep {\n  id: string;\n  label: string;\n  status?: StepStatus;\n}\n\nexport interface ThinkingIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Whether thinking is active */\n  active?: boolean;\n  /** Status text */\n  label?: string;\n  /** Animation style */\n  variant?: ThinkingVariant;\n  /** Show elapsed time */\n  showElapsed?: boolean;\n  /** Multi-step progress */\n  steps?: ThinkingStep[];\n}\n\nexport interface ThinkingStepsProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\nexport interface ThinkingStepProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Step label */\n  label: string;\n  /** Step status */\n  status?: StepStatus;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface ThinkingIndicatorContextValue {\n  active: boolean;\n  variant: ThinkingVariant;\n}\n\nconst ThinkingIndicatorContext = React.createContext<ThinkingIndicatorContextValue | null>(null);\n\nfunction useThinkingIndicatorContext() {\n  const context = React.useContext(ThinkingIndicatorContext);\n  if (!context) {\n    throw new Error('ThinkingIndicator compound components must be used within a ThinkingIndicator');\n  }\n  return context;\n}\n\n// ============================================\n// Hooks\n// ============================================\n\nfunction useElapsedTime(active: boolean): string {\n  const [elapsed, setElapsed] = React.useState(0);\n  const startTimeRef = React.useRef<number>(Date.now());\n\n  React.useEffect(() => {\n    if (!active) {\n      setElapsed(0);\n      return;\n    }\n\n    startTimeRef.current = Date.now();\n    const interval = setInterval(() => {\n      setElapsed(Date.now() - startTimeRef.current);\n    }, 1000);\n\n    return () => clearInterval(interval);\n  }, [active]);\n\n  if (elapsed < 1000) return '';\n\n  const seconds = Math.floor(elapsed / 1000);\n  if (seconds < 60) return `${seconds}s`;\n\n  const minutes = Math.floor(seconds / 60);\n  const remainingSeconds = seconds % 60;\n  return `${minutes}m ${remainingSeconds}s`;\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction CheckIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <polyline points=\"20 6 9 17 4 12\" />\n    </svg>\n  );\n}\n\nfunction ErrorIcon() {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"3\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n}\n\n// ============================================\n// Sub-components\n// ============================================\n\nfunction ThinkingSteps({ children, className, ...htmlProps }: ThinkingStepsProps) {\n  const classes = [styles.steps, className].filter(Boolean).join(' ');\n\n  return (\n    <div {...htmlProps} className={classes}>\n      {children}\n    </div>\n  );\n}\n\nfunction ThinkingStep({\n  label,\n  status = 'pending',\n  className,\n  ...htmlProps\n}: ThinkingStepProps) {\n  const classes = [\n    styles.step,\n    styles[`step${status.charAt(0).toUpperCase() + status.slice(1)}`],\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div {...htmlProps} className={classes}>\n      <span className={styles.stepIndicator}>\n        {status === 'complete' && <CheckIcon />}\n        {status === 'error' && <ErrorIcon />}\n        {status === 'active' && <Loading size=\"sm\" variant=\"spinner\" color=\"current\" label=\"\" />}\n        {status === 'pending' && <span className={styles.stepDot} />}\n      </span>\n      <span className={styles.stepLabel}>{label}</span>\n    </div>\n  );\n}\n\n// ============================================\n// Main Component\n// ============================================\n\nfunction ThinkingIndicatorRoot({\n  active = true,\n  label = 'Thinking...',\n  variant = 'dots',\n  showElapsed = false,\n  steps,\n  className,\n  ...htmlProps\n}: ThinkingIndicatorProps) {\n  const elapsedTime = useElapsedTime(active && showElapsed);\n\n  const contextValue: ThinkingIndicatorContextValue = {\n    active,\n    variant,\n  };\n\n  if (!active) return null;\n\n  const classes = [\n    styles.thinkingIndicator,\n    className,\n  ].filter(Boolean).join(' ');\n\n  // Map ThinkingIndicator variants to Loading variants\n  const loadingVariant = variant === 'dots' ? 'dots'\n    : variant === 'pulse' ? 'pulse'\n    : 'spinner';\n\n  return (\n    <ThinkingIndicatorContext.Provider value={contextValue}>\n      <div\n        {...htmlProps}\n        className={classes}\n        role=\"status\"\n        aria-label={label}\n        aria-live=\"polite\"\n      >\n        <div className={styles.main}>\n          <Loading size=\"sm\" variant={loadingVariant} color=\"muted\" label=\"\" />\n          <span className={styles.label}>{label}</span>\n          {showElapsed && elapsedTime && (\n            <span className={styles.elapsed}>{elapsedTime}</span>\n          )}\n        </div>\n\n        {steps && steps.length > 0 && (\n          <ThinkingSteps>\n            {steps.map((step) => (\n              <ThinkingStep\n                key={step.id}\n                label={step.label}\n                status={step.status}\n              />\n            ))}\n          </ThinkingSteps>\n        )}\n      </div>\n    </ThinkingIndicatorContext.Provider>\n  );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const ThinkingIndicator = Object.assign(ThinkingIndicatorRoot, {\n  Steps: ThinkingSteps,\n  Step: ThinkingStep,\n});\n\nexport {\n  ThinkingIndicatorRoot,\n  ThinkingSteps,\n  ThinkingStep,\n};\n\nexport { useThinkingIndicatorContext };\n"],"names":[],"mappings":"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"}

package/dist/components/Toast/Toast.module.scss.cjs

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const container = "_container_1gwoj_1";
+const topleft = "_topleft_1gwoj_15";
+const topcenter = "_topcenter_1gwoj_20";
+const topright = "_topright_1gwoj_26";
+const bottomleft = "_bottomleft_1gwoj_31";
+const bottomcenter = "_bottomcenter_1gwoj_37";
+const bottomright = "_bottomright_1gwoj_44";
+const toast = "_toast_1gwoj_50";
+const toastEnter = "_toastEnter_1gwoj_1";
+const icon = "_icon_1gwoj_73";
+const success = "_success_1gwoj_77";
+const error = "_error_1gwoj_84";
+const warning = "_warning_1gwoj_91";
+const info = "_info_1gwoj_98";
+const content = "_content_1gwoj_116";
+const title = "_title_1gwoj_121";
+const description = "_description_1gwoj_128";
+const action = "_action_1gwoj_135";
+const close = "_close_1gwoj_160";
+const styles = {
+  container,
+  topleft,
+  topcenter,
+  topright,
+  bottomleft,
+  bottomcenter,
+  bottomright,
+  toast,
+  toastEnter,
+  "default": "_default_1gwoj_73",
+  icon,
+  success,
+  error,
+  warning,
+  info,
+  content,
+  title,
+  description,
+  action,
+  close
+};
+exports.action = action;
+exports.bottomcenter = bottomcenter;
+exports.bottomleft = bottomleft;
+exports.bottomright = bottomright;
+exports.close = close;
+exports.container = container;
+exports.content = content;
+exports.default = styles;
+exports.description = description;
+exports.error = error;
+exports.icon = icon;
+exports.info = info;
+exports.success = success;
+exports.title = title;
+exports.toast = toast;
+exports.toastEnter = toastEnter;
+exports.topcenter = topcenter;
+exports.topleft = topleft;
+exports.topright = topright;
+exports.warning = warning;
+//# sourceMappingURL=Toast.module.scss.cjs.map

package/dist/components/Toast/Toast.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Toast/Toast.module.scss.js

@@ -0,0 +1,64 @@
+const container = "_container_1gwoj_1";
+const topleft = "_topleft_1gwoj_15";
+const topcenter = "_topcenter_1gwoj_20";
+const topright = "_topright_1gwoj_26";
+const bottomleft = "_bottomleft_1gwoj_31";
+const bottomcenter = "_bottomcenter_1gwoj_37";
+const bottomright = "_bottomright_1gwoj_44";
+const toast = "_toast_1gwoj_50";
+const toastEnter = "_toastEnter_1gwoj_1";
+const icon = "_icon_1gwoj_73";
+const success = "_success_1gwoj_77";
+const error = "_error_1gwoj_84";
+const warning = "_warning_1gwoj_91";
+const info = "_info_1gwoj_98";
+const content = "_content_1gwoj_116";
+const title = "_title_1gwoj_121";
+const description = "_description_1gwoj_128";
+const action = "_action_1gwoj_135";
+const close = "_close_1gwoj_160";
+const styles = {
+  container,
+  topleft,
+  topcenter,
+  topright,
+  bottomleft,
+  bottomcenter,
+  bottomright,
+  toast,
+  toastEnter,
+  "default": "_default_1gwoj_73",
+  icon,
+  success,
+  error,
+  warning,
+  info,
+  content,
+  title,
+  description,
+  action,
+  close
+};
+export {
+  action,
+  bottomcenter,
+  bottomleft,
+  bottomright,
+  close,
+  container,
+  content,
+  styles as default,
+  description,
+  error,
+  icon,
+  info,
+  success,
+  title,
+  toast,
+  toastEnter,
+  topcenter,
+  topleft,
+  topright,
+  warning
+};
+//# sourceMappingURL=Toast.module.scss.js.map

package/dist/components/Toast/Toast.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}