@uipath/apollo-wind 2.3.0 → 2.4.0

package/dist/components/ui/index.cjs

@@ -30,10 +30,10 @@ var __webpack_modules__ = {
     "@/components/ui/calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
-    "./card" (module) {
+    "@/components/ui/card" (module) {
         module.exports = require("./card.cjs");
     },
-    "@/components/ui/checkbox" (module) {
+    "./checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
     "./collapsible" (module) {
@@ -57,13 +57,13 @@ var __webpack_modules__ = {
     "./datetime-picker" (module) {
         module.exports = require("./datetime-picker.cjs");
     },
-    "./dialog" (module) {
+    "@/components/ui/dialog" (module) {
         module.exports = require("./dialog.cjs");
     },
-    "@/components/ui/dropdown-menu" (module) {
+    "./dropdown-menu" (module) {
         module.exports = require("./dropdown-menu.cjs");
     },
-    "@/components/ui/editable-cell" (module) {
+    "./editable-cell" (module) {
         module.exports = require("./editable-cell.cjs");
     },
     "./empty-state" (module) {
@@ -150,7 +150,7 @@ var __webpack_modules__ = {
     "./toggle-group" (module) {
         module.exports = require("./toggle-group.cjs");
     },
-    "./toggle" (module) {
+    "@/components/ui/toggle" (module) {
         module.exports = require("./toggle.cjs");
     },
     "./tooltip" (module) {
@@ -276,14 +276,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_calendar__rspack_import_9[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _card__rspack_import_10 = __webpack_require__("./card");
+    var _card__rspack_import_10 = __webpack_require__("@/components/ui/card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _card__rspack_import_10)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_card__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _checkbox__rspack_import_11 = __webpack_require__("@/components/ui/checkbox");
+    var _checkbox__rspack_import_11 = __webpack_require__("./checkbox");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _checkbox__rspack_import_11)if ([
         "TreeView",
@@ -339,21 +339,21 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_datetime_picker__rspack_import_18[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dialog__rspack_import_19 = __webpack_require__("./dialog");
+    var _dialog__rspack_import_19 = __webpack_require__("@/components/ui/dialog");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dialog__rspack_import_19)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dialog__rspack_import_19[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dropdown_menu__rspack_import_20 = __webpack_require__("@/components/ui/dropdown-menu");
+    var _dropdown_menu__rspack_import_20 = __webpack_require__("./dropdown-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dropdown_menu__rspack_import_20)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dropdown_menu__rspack_import_20[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _editable_cell__rspack_import_21 = __webpack_require__("@/components/ui/editable-cell");
+    var _editable_cell__rspack_import_21 = __webpack_require__("./editable-cell");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _editable_cell__rspack_import_21)if ([
         "TreeView",
@@ -549,7 +549,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_48[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_49 = __webpack_require__("./toggle");
+    var _toggle__rspack_import_49 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _toggle__rspack_import_49)if ([
         "TreeView",

package/dist/styles.css

@@ -7807,6 +7807,24 @@ body.dark-hc, .apollo-design.dark-hc {
   --border: var(--border-dark-hc);
   color-scheme: dark;
 }
+@keyframes apollo-glow {
+  0% {
+    box-shadow: 0 0 0 0 var(--_glow-shadow, currentColor);
+  }
+  70% {
+    box-shadow: 0 0 0 10px transparent;
+  }
+  100% {
+    box-shadow: 0 0 0 0 transparent;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  .animate-glow {
+    will-change: auto;
+    animation: none;
+    box-shadow: 0 0 0 5px var(--_glow-shadow, currentColor);
+  }
+}
 :root {
   --radius: 0.75rem;
 }

package/dist/tailwind.css

@@ -13,6 +13,8 @@
 @import "tailwindcss";
 @import "@uipath/apollo-core/tokens/css/theme-variables.css";
 
+@import "./tailwind.utilities.css";
+
 :root {
   --radius: 0.75rem;
   /* 12px — base border-radius for buttons and UI elements */
@@ -1291,4 +1293,4 @@ body.canvas, .canvas {
   & *::-webkit-scrollbar-thumb:hover {
     background-color: var(--color-border-hover);
   }
-}
+}

package/dist/tailwind.utilities.css

@@ -0,0 +1,54 @@
+/**
+ * Apollo Wind — Custom Utilities
+ *
+ * Tailwind @utility rules, @keyframes, and non-token helpers that extend
+ * the base theme. Imported by tailwind.consumer.css.
+ *
+ */
+
+/* ============================================================================
+ * Glow — attention-drawing ring pulse
+ *
+ * `animate-glow` drives an expanding box-shadow ring around any element.
+ * The color and intensity are driven by CSS variables so the same utility
+ * works for status indicators, brand highlights, ad-hoc attention prompts,
+ * or any custom color.
+ *
+ * Knobs (set via inline style or a Tailwind arbitrary value):
+ *   --glow-color    source color  (default: currentColor)
+ *   --glow-strength mix percent   (default: 40%)
+ *
+ * Examples:
+ *   <div className="animate-glow [--glow-color:var(--error)]" />
+ *   <div className="animate-glow [--glow-color:var(--info)] [--glow-strength:60%]" />
+ *   <div className="text-info animate-glow" />   // picks up --brand or falls back to currentColor
+ *
+ * Implementation note: the color-mix lives in the utility body (not the
+ * keyframe) to avoid a lightningcss bug that drops keyframe declarations
+ * containing `color-mix(... var(...) ...)`. The internal `--_glow-shadow`
+ * holds the pre-mixed value for the keyframe to consume.
+ * ============================================================================ */
+
+@keyframes apollo-glow {
+  0%   { box-shadow: 0 0 0 0 var(--_glow-shadow, currentColor); }
+  70%  { box-shadow: 0 0 0 10px transparent; }
+  100% { box-shadow: 0 0 0 0 transparent; }
+}
+
+@utility animate-glow {
+  --_glow-shadow: color-mix(
+    in srgb,
+    var(--glow-color, var(--brand, currentColor)) var(--glow-strength, 40%),
+    transparent
+  );
+  will-change: box-shadow;
+  animation: apollo-glow 2s infinite;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .animate-glow {
+    will-change: auto;
+    animation: none;
+    box-shadow: 0 0 0 5px var(--_glow-shadow, currentColor);
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",