@yourgpt/copilot-sdk 1.4.33 → 1.4.34

package/README.md

@@ -49,6 +49,8 @@ function App() {
 
 > **Note:** The `@source` path must point to `dist/` (not `src/`) and include all file extensions `{js,ts,jsx,tsx}`.
 
+> **Important:** For Tailwind v4, you also need the `@theme inline` block to map CSS variables like `--background` to Tailwind utilities like `bg-background`. If you have shadcn/ui, this is already configured. Otherwise, see the [Quick Start guide](https://copilot-sdk.yourgpt.ai/docs/quickstart) for complete setup.
+
 ## Theming
 
 Works automatically with existing shadcn/ui setup. For projects without shadcn:

package/dist/styles.css

@@ -62,3 +62,95 @@
   --input: hsl(240 3.7% 15.9%);
   --ring: hsl(240 4.9% 83.9%);
 }
+
+/* Loader Animations */
+@keyframes csdk-spinner-fade {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.15; }
+}
+
+@keyframes csdk-thin-pulse {
+  0%, 100% { opacity: 1; transform: scale(1); }
+  50% { opacity: 0.5; transform: scale(0.85); }
+}
+
+@keyframes csdk-pulse-dot {
+  0%, 100% { opacity: 1; transform: scale(1); }
+  50% { opacity: 0.4; transform: scale(0.75); }
+}
+
+@keyframes csdk-bounce-dots {
+  0%, 80%, 100% { transform: translateY(0); }
+  40% { transform: translateY(-6px); }
+}
+
+@keyframes csdk-typing {
+  0%, 60%, 100% { opacity: 0.3; transform: scale(0.8); }
+  30% { opacity: 1; transform: scale(1); }
+}
+
+@keyframes csdk-wave {
+  0%, 100% { transform: scaleY(0.5); }
+  50% { transform: scaleY(1); }
+}
+
+@keyframes csdk-blink {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0; }
+}
+
+@keyframes csdk-text-blink {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.4; }
+}
+
+@keyframes csdk-shimmer {
+  0% { background-position: 100% center; }
+  100% { background-position: -100% center; }
+}
+
+@keyframes csdk-loading-dots {
+  0%, 20% { opacity: 0; }
+  40%, 100% { opacity: 1; }
+}
+
+/* Loader Animation Classes */
+.csdk-loader-spinner-fade {
+  animation: csdk-spinner-fade 1.2s linear infinite;
+}
+
+.csdk-loader-thin-pulse {
+  animation: csdk-thin-pulse 1.5s ease-in-out infinite;
+}
+
+.csdk-loader-pulse-dot {
+  animation: csdk-pulse-dot 1.2s ease-in-out infinite;
+}
+
+.csdk-loader-bounce-dots {
+  animation: csdk-bounce-dots 1.4s ease-in-out infinite;
+}
+
+.csdk-loader-typing {
+  animation: csdk-typing 1s infinite;
+}
+
+.csdk-loader-wave {
+  animation: csdk-wave 1s ease-in-out infinite;
+}
+
+.csdk-loader-blink {
+  animation: csdk-blink 1s step-end infinite;
+}
+
+.csdk-loader-text-blink {
+  animation: csdk-text-blink 2s ease-in-out infinite;
+}
+
+.csdk-loader-shimmer {
+  animation: csdk-shimmer 4s infinite linear;
+}
+
+.csdk-loader-loading-dots {
+  animation: csdk-loading-dots 1.4s infinite;
+}