@uipath/apollo-wind 2.44.0 → 2.45.0

package/README.md

@@ -19,6 +19,18 @@ npm install @uipath/apollo-wind
 
 **Note:** This package is published to both npm and GitHub Package Registry. External users will automatically pull from npm. Internal UiPath users with `.npmrc` configured will automatically pull from GitHub Package Registry.
 
+**Fonts:** the Future themes (`.future-light` / `.future-dark`) point
+`--font-sans` at Inter and the bundled Noto families, but `tailwind.css` ships
+no `@font-face`. Import the font stylesheet once at your app entry, or those
+tokens fall back to the OS font:
+
+```tsx
+import "@uipath/apollo-wind/fonts/font.css";
+```
+
+Classic themes keep Tailwind's default `--font-sans` and need no font import.
+Apps that already import `@uipath/apollo-react/core/fonts/font.css` are covered.
+
 **Option 1: Zero Config** (Recommended for quick starts)
 
 ```tsx

package/dist/components/ui/index.cjs

@@ -15,7 +15,7 @@ var __webpack_modules__ = {
     "./avatar" (module) {
         module.exports = require("./avatar.cjs");
     },
-    "./badge" (module) {
+    "@/components/ui/badge" (module) {
         module.exports = require("./badge.cjs");
     },
     "./breadcrumb" (module) {
@@ -24,31 +24,31 @@ var __webpack_modules__ = {
     "./button-group" (module) {
         module.exports = require("./button-group.cjs");
     },
-    "./button" (module) {
+    "@/components/ui/button" (module) {
         module.exports = require("./button.cjs");
     },
-    "./calendar" (module) {
+    "@/components/ui/calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
-    "./card" (module) {
+    "@/components/ui/card" (module) {
         module.exports = require("./card.cjs");
     },
     "./chart" (module) {
         module.exports = require("./chart.cjs");
     },
-    "./checkbox" (module) {
+    "@/components/ui/checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
-    "./collapsible" (module) {
+    "@/components/ui/collapsible" (module) {
         module.exports = require("./collapsible.cjs");
     },
     "./combobox" (module) {
         module.exports = require("./combobox.cjs");
     },
-    "./command" (module) {
+    "@/components/ui/command" (module) {
         module.exports = require("./command.cjs");
     },
-    "./context-menu" (module) {
+    "@/components/ui/context-menu" (module) {
         module.exports = require("./context-menu.cjs");
     },
     "./data-table" (module) {
@@ -60,16 +60,16 @@ var __webpack_modules__ = {
     "./datetime-picker" (module) {
         module.exports = require("./datetime-picker.cjs");
     },
-    "./dialog" (module) {
+    "@/components/ui/dialog" (module) {
         module.exports = require("./dialog.cjs");
     },
     "./drawer" (module) {
         module.exports = require("./drawer.cjs");
     },
-    "./dropdown-menu" (module) {
+    "@/components/ui/dropdown-menu" (module) {
         module.exports = require("./dropdown-menu.cjs");
     },
-    "./editable-cell" (module) {
+    "@/components/ui/editable-cell" (module) {
         module.exports = require("./editable-cell.cjs");
     },
     "./empty-state" (module) {
@@ -81,16 +81,16 @@ var __webpack_modules__ = {
     "./form-field" (module) {
         module.exports = require("./form-field.cjs");
     },
-    "./hover-card" (module) {
+    "@/components/ui/hover-card" (module) {
         module.exports = require("./hover-card.cjs");
     },
-    "./input-group" (module) {
+    "@/components/ui/input-group" (module) {
         module.exports = require("./input-group.cjs");
     },
-    "./input" (module) {
+    "@/components/ui/input" (module) {
         module.exports = require("./input.cjs");
     },
-    "./label" (module) {
+    "@/components/ui/label" (module) {
         module.exports = require("./label.cjs");
     },
     "./layout" (module) {
@@ -108,7 +108,7 @@ var __webpack_modules__ = {
     "@/components/ui/popover" (module) {
         module.exports = require("./popover.cjs");
     },
-    "./portal-container" (module) {
+    "@/components/ui/portal-container" (module) {
         module.exports = require("./portal-container.cjs");
     },
     "./progress" (module) {
@@ -165,13 +165,13 @@ var __webpack_modules__ = {
     "./tabs" (module) {
         module.exports = require("./tabs.cjs");
     },
-    "./textarea" (module) {
+    "@/components/ui/textarea" (module) {
         module.exports = require("./textarea.cjs");
     },
     "./toggle-group" (module) {
         module.exports = require("./toggle-group.cjs");
     },
-    "./toggle" (module) {
+    "@/components/ui/toggle" (module) {
         module.exports = require("./toggle.cjs");
     },
     "./tooltip" (module) {
@@ -265,7 +265,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_avatar__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _badge__rspack_import_5 = __webpack_require__("./badge");
+    var _badge__rspack_import_5 = __webpack_require__("@/components/ui/badge");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _badge__rspack_import_5)if ([
         "TreeView",
@@ -279,7 +279,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_breadcrumb__rspack_import_6[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _button__rspack_import_7 = __webpack_require__("./button");
+    var _button__rspack_import_7 = __webpack_require__("@/components/ui/button");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _button__rspack_import_7)if ([
         "TreeView",
@@ -293,14 +293,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_button_group__rspack_import_8[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _calendar__rspack_import_9 = __webpack_require__("./calendar");
+    var _calendar__rspack_import_9 = __webpack_require__("@/components/ui/calendar");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _calendar__rspack_import_9)if ([
         "TreeView",
         "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",
@@ -314,14 +314,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_chart__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _checkbox__rspack_import_12 = __webpack_require__("./checkbox");
+    var _checkbox__rspack_import_12 = __webpack_require__("@/components/ui/checkbox");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _checkbox__rspack_import_12)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapsible__rspack_import_13 = __webpack_require__("./collapsible");
+    var _collapsible__rspack_import_13 = __webpack_require__("@/components/ui/collapsible");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _collapsible__rspack_import_13)if ([
         "TreeView",
@@ -335,14 +335,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_combobox__rspack_import_14[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _command__rspack_import_15 = __webpack_require__("./command");
+    var _command__rspack_import_15 = __webpack_require__("@/components/ui/command");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _command__rspack_import_15)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_command__rspack_import_15[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _context_menu__rspack_import_16 = __webpack_require__("./context-menu");
+    var _context_menu__rspack_import_16 = __webpack_require__("@/components/ui/context-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _context_menu__rspack_import_16)if ([
         "TreeView",
@@ -370,7 +370,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_datetime_picker__rspack_import_19[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dialog__rspack_import_20 = __webpack_require__("./dialog");
+    var _dialog__rspack_import_20 = __webpack_require__("@/components/ui/dialog");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dialog__rspack_import_20)if ([
         "TreeView",
@@ -384,14 +384,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_drawer__rspack_import_21[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dropdown_menu__rspack_import_22 = __webpack_require__("./dropdown-menu");
+    var _dropdown_menu__rspack_import_22 = __webpack_require__("@/components/ui/dropdown-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dropdown_menu__rspack_import_22)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dropdown_menu__rspack_import_22[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _editable_cell__rspack_import_23 = __webpack_require__("./editable-cell");
+    var _editable_cell__rspack_import_23 = __webpack_require__("@/components/ui/editable-cell");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _editable_cell__rspack_import_23)if ([
         "TreeView",
@@ -419,28 +419,28 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_file_upload__rspack_import_26[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _hover_card__rspack_import_27 = __webpack_require__("./hover-card");
+    var _hover_card__rspack_import_27 = __webpack_require__("@/components/ui/hover-card");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _hover_card__rspack_import_27)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hover_card__rspack_import_27[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input__rspack_import_28 = __webpack_require__("./input");
+    var _input__rspack_import_28 = __webpack_require__("@/components/ui/input");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input__rspack_import_28)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input__rspack_import_28[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input_group__rspack_import_29 = __webpack_require__("./input-group");
+    var _input_group__rspack_import_29 = __webpack_require__("@/components/ui/input-group");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input_group__rspack_import_29)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input_group__rspack_import_29[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _label__rspack_import_30 = __webpack_require__("./label");
+    var _label__rspack_import_30 = __webpack_require__("@/components/ui/label");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _label__rspack_import_30)if ([
         "TreeView",
@@ -482,7 +482,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_popover__rspack_import_35[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _portal_container__rspack_import_36 = __webpack_require__("./portal-container");
+    var _portal_container__rspack_import_36 = __webpack_require__("@/components/ui/portal-container");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _portal_container__rspack_import_36)if ([
         "TreeView",
@@ -615,14 +615,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tabs__rspack_import_54[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _textarea__rspack_import_55 = __webpack_require__("./textarea");
+    var _textarea__rspack_import_55 = __webpack_require__("@/components/ui/textarea");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _textarea__rspack_import_55)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_55[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_56 = __webpack_require__("./toggle");
+    var _toggle__rspack_import_56 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _toggle__rspack_import_56)if ([
         "TreeView",

package/dist/fonts/font.css

@@ -0,0 +1 @@
+@import "@uipath/apollo-core/fonts/font.css";

package/dist/foundation/Future/typography.cjs

@@ -30,11 +30,12 @@ __webpack_require__.d(__webpack_exports__, {
     letterSpacing: ()=>letterSpacing,
     lineHeight: ()=>lineHeight
 });
+const SANS_STACK = "'Inter', 'noto-sans', 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans SC', 'Noto Sans TC', system-ui, sans-serif";
 const fontFamily = {
-    base: "'Inter', system-ui, -apple-system, sans-serif",
+    base: SANS_STACK,
     monospace: "'JetBrains Mono', 'SF Mono', 'Fira Code', 'Fira Mono', Menlo, monospace",
-    numeric: "'Inter', system-ui, -apple-system, sans-serif",
-    sans: "'Inter', system-ui, -apple-system, sans-serif"
+    numeric: SANS_STACK,
+    sans: SANS_STACK
 };
 const fontSize = {
     xs: 12,

package/dist/foundation/Future/typography.d.ts

@@ -8,13 +8,17 @@
  */
 export declare const fontFamily: {
     /** Primary sans-serif stack — used for all UI text */
-    readonly base: "'Inter', system-ui, -apple-system, sans-serif";
-    /** Monospace stack — used for code, data, and technical content */
+    readonly base: string;
+    /**
+     * Monospace stack — used for code, data, and technical content.
+     * None of these ship with apollo-core: Storybook loads JetBrains Mono from
+     * the Google Fonts CDN, consumers resolve to an OS mono font.
+     */
     readonly monospace: "'JetBrains Mono', 'SF Mono', 'Fira Code', 'Fira Mono', Menlo, monospace";
     /** Numeric stack — used for tabular numbers and data displays */
-    readonly numeric: "'Inter', system-ui, -apple-system, sans-serif";
+    readonly numeric: string;
     /** @deprecated Use `fontFamily.base` instead */
-    readonly sans: "'Inter', system-ui, -apple-system, sans-serif";
+    readonly sans: string;
 };
 /**
  * Font size scale in pixels.

package/dist/foundation/Future/typography.js

@@ -1,8 +1,9 @@
+const SANS_STACK = "'Inter', 'noto-sans', 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans SC', 'Noto Sans TC', system-ui, sans-serif";
 const fontFamily = {
-    base: "'Inter', system-ui, -apple-system, sans-serif",
+    base: SANS_STACK,
     monospace: "'JetBrains Mono', 'SF Mono', 'Fira Code', 'Fira Mono', Menlo, monospace",
-    numeric: "'Inter', system-ui, -apple-system, sans-serif",
-    sans: "'Inter', system-ui, -apple-system, sans-serif"
+    numeric: SANS_STACK,
+    sans: SANS_STACK
 };
 const fontSize = {
     xs: 12,

package/dist/styles.css

@@ -9997,6 +9997,35 @@ body.future-dark, .future-dark, body.future-light, .future-light {
   --destructive: var(--color-red-500);
   --destructive-foreground: var(--color-zinc-50);
   --input: var(--ap-wind-border);
+  --font-sans: Inter, noto-sans, "Noto Sans JP", "Noto Sans KR", "Noto Sans SC",
+    "Noto Sans TC", system-ui, sans-serif;
+  --font-normal: var(--font-sans);
+  --font-title: var(--font-sans);
+  --font-hero-bold-family: var(--font-sans);
+  --font-hero-family: var(--font-sans);
+  --font-header-1-bold-family: var(--font-sans);
+  --font-header-1-family: var(--font-sans);
+  --font-header-2-bold-family: var(--font-sans);
+  --font-header-2-family: var(--font-sans);
+  --font-header-3-bold-family: var(--font-sans);
+  --font-header-3-family: var(--font-sans);
+  --font-header-4-bold-family: var(--font-sans);
+  --font-header-4-family: var(--font-sans);
+  --font-l-bold-family: var(--font-sans);
+  --font-l-family: var(--font-sans);
+  --font-m-bold-family: var(--font-sans);
+  --font-m-family: var(--font-sans);
+  --font-link-family: var(--font-sans);
+  --font-s-bold-family: var(--font-sans);
+  --font-s-family: var(--font-sans);
+  --font-xs-bold-family: var(--font-sans);
+  --font-xs-family: var(--font-sans);
+  --font-brand-h-4-family: var(--font-sans);
+  --font-brand-l-family: var(--font-sans);
+  --font-brand-m-family: var(--font-sans);
+}
+body.future-dark.future-dark, .future-dark.future-dark, body.future-light.future-light, .future-light.future-light {
+  font-family: var(--font-sans);
 }
 body.future-dark, .future-dark {
   --gradient-1: linear-gradient(127deg, #3f3f47 25.94%, #27272a 74.06%);

package/dist/tailwind.css

@@ -185,6 +185,44 @@ body.future-light, .future-light {
   --destructive: var(--color-red-500);
   --destructive-foreground: var(--color-zinc-50);
   --input: var(--ap-wind-border);
+
+  /* Typography: Inter, shipped by apollo-core. Neither Inter nor noto-sans
+     covers CJK, so the four bundled Noto CJK families are chained explicitly
+     to keep ja/ko/zh resolving. Mono tokens untouched. */
+  --font-sans: Inter, noto-sans, "Noto Sans JP", "Noto Sans KR", "Noto Sans SC",
+    "Noto Sans TC", system-ui, sans-serif;
+  --font-normal: var(--font-sans);
+  --font-title: var(--font-sans);
+  --font-hero-bold-family: var(--font-sans);
+  --font-hero-family: var(--font-sans);
+  --font-header-1-bold-family: var(--font-sans);
+  --font-header-1-family: var(--font-sans);
+  --font-header-2-bold-family: var(--font-sans);
+  --font-header-2-family: var(--font-sans);
+  --font-header-3-bold-family: var(--font-sans);
+  --font-header-3-family: var(--font-sans);
+  --font-header-4-bold-family: var(--font-sans);
+  --font-header-4-family: var(--font-sans);
+  --font-l-bold-family: var(--font-sans);
+  --font-l-family: var(--font-sans);
+  --font-m-bold-family: var(--font-sans);
+  --font-m-family: var(--font-sans);
+  --font-link-family: var(--font-sans);
+  --font-s-bold-family: var(--font-sans);
+  --font-s-family: var(--font-sans);
+  --font-xs-bold-family: var(--font-sans);
+  --font-xs-family: var(--font-sans);
+  --font-brand-h-4-family: var(--font-sans);
+  --font-brand-l-family: var(--font-sans);
+  --font-brand-m-family: var(--font-sans);
+}
+
+/* Preflight pins --default-font-family at :root, so the theme class must set
+   font-family itself. Class doubled to outrank apollo's legacy Angular bundle,
+   which injects `.apollo-design { font-family: noto-sans }` (0,1,0) at runtime. */
+body.future-dark.future-dark, .future-dark.future-dark,
+body.future-light.future-light, .future-light.future-light {
+  font-family: var(--font-sans);
 }
 
 /* ── Future gradients (theme-specific stops, no core counterpart yet) ────── */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "2.44.0",
+  "version": "2.45.0",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",
@@ -42,6 +42,7 @@
     },
     "./styles.css": "./dist/styles.css",
     "./tailwind.css": "./dist/tailwind.css",
+    "./fonts/*": "./dist/fonts/*",
     "./tailwind": {
       "import": "./dist/tailwind.preset.js",
       "require": "./dist/tailwind.preset.cjs"
@@ -124,7 +125,7 @@
     "tailwindcss": "^4.1.17",
     "vaul": "^1.1.2",
     "zod": "^4.3.5",
-    "@uipath/apollo-core": "5.13.1"
+    "@uipath/apollo-core": "5.14.0"
   },
   "devDependencies": {
     "@codemirror/lang-javascript": "^6.2.5",