asma-ui-core 3.78.3 → 3.78.4

package/dist/components/custom/pathfinder-card/PathfinderCard.js

@@ -1,19 +1,18 @@
-import { cn as b } from "../../../helpers/cn.js";
-import { ChevronDownIcon as F } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
-import { ChevronUpIcon as O } from "../../icons/chevron-up-icon/ChevronUpIcon.js";
+import { cn as C } from "../../../helpers/cn.js";
+import { ChevronDownIcon as j } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
+import { ChevronUpIcon as z } from "../../icons/chevron-up-icon/ChevronUpIcon.js";
 import h from "./Pathfinder.module.js";
-import { useCallback as I, useEffect as M, useLayoutEffect as j, useMemo as y, useRef as R, useState as x, useSyncExternalStore as P } from "react";
-import { Fragment as D, jsx as e, jsxs as k } from "react/jsx-runtime";
-var _ = typeof window < "u" ? j : M;
+import { useCallback as R, useEffect as M, useLayoutEffect as O, useMemo as y, useRef as k, useState as x, useSyncExternalStore as P } from "react";
+import { Fragment as D, jsx as e, jsxs as I } from "react/jsx-runtime";
+var _ = typeof window < "u" ? O : M;
 function q() {
-  const [i, n] = x(null), d = I((t) => {
+  const [i, n] = x(null), d = R((t) => {
     n(t);
-  }, []), s = I(() => i ? Math.floor(i.getBoundingClientRect().width) : 0, [i]);
+  }, []), s = R(() => i ? Math.floor(i.getBoundingClientRect().width) : 0, [i]);
   return {
     ref: d,
-    width: P(I((t) => {
+    width: P(R((t) => {
       if (!i || typeof ResizeObserver > "u") return () => {
-        console.log("Node is missing or ResizeObserver is undefined");
       };
       let a = 0;
       const o = new ResizeObserver(() => {
@@ -32,15 +31,15 @@ function A(i) {
   });
 }
 function K(i) {
-  const { items: n, leadSlot: d, actionSlot: s } = i, t = R({}), a = R(null), o = R(null), [l, v] = x({
+  const { items: n, leadSlot: d, actionSlot: s } = i, t = k({}), a = k(null), o = k(null), [l, v] = x({
     itemWidths: {},
     leadWidth: 0,
     actionWidth: 0
-  }), f = R(l);
+  }), f = k(l);
   M(() => {
     f.current = l;
   }, [l]);
-  const p = I((r) => (m) => {
+  const p = R((r) => (m) => {
     t.current[r] = m;
   }, []);
   return _(() => {
@@ -76,7 +75,7 @@ function U(i) {
   }
   return a;
 }
-function C({ item: i, compact: n }) {
+function b({ item: i, compact: n }) {
   return /* @__PURE__ */ e(D, { children: i.render({ compact: n }) });
 }
 function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot: t, className: a, leadReservePx: o = 140, actionReservePx: l = 44 }) {
@@ -86,10 +85,10 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
     actionSlot: t
   }), w = y(() => {
     if (n) return r;
-    const c = 24, L = 24, z = s ? Math.max(o, m.leadWidth + 12) : 0, B = t ? Math.max(l, m.actionWidth) : 0;
+    const c = 24, L = 24, B = s ? Math.max(o, m.leadWidth + 12) : 0, F = t ? Math.max(l, m.actionWidth) : 0;
     return U({
       items: r,
-      availableWidth: Math.max(0, f - c - L - z - B - 24),
+      availableWidth: Math.max(0, f - c - L - B - F - 24),
       gapPx: 12,
       itemWidths: m.itemWidths
     });
@@ -103,9 +102,9 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
     l,
     m
   ]), N = p && w.length < Math.min(2, r.length), E = N ? r.slice(0, 2) : w;
-  return /* @__PURE__ */ k("div", {
+  return /* @__PURE__ */ I("div", {
     ref: v,
-    className: b(h.root, p ? "overflow-hidden" : "overflow-visible", a),
+    className: C(h.root, p ? "overflow-hidden" : "overflow-visible", a),
     "aria-expanded": n,
     role: "button",
     tabIndex: 0,
@@ -114,27 +113,27 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
       (c.key === "Enter" || c.key === " ") && (c.preventDefault(), d());
     },
     children: [
-      /* @__PURE__ */ k("div", {
-        className: b(h.shell, p ? h.shellCompact : h.shellExpanded),
+      /* @__PURE__ */ I("div", {
+        className: C(h.shell, p ? h.shellCompact : h.shellExpanded),
         children: [s ? /* @__PURE__ */ e("div", {
           className: "shrink-0",
           children: s
         }) : null, /* @__PURE__ */ e("div", {
           className: h.content,
           children: p ? /* @__PURE__ */ e("div", {
-            className: b(h.compactItems, N && h.compactItemsStacked),
+            className: C(h.compactItems, N && h.compactItemsStacked),
             children: E.map((c) => /* @__PURE__ */ e("div", {
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(C, {
+              children: /* @__PURE__ */ e(b, {
                 item: c,
                 compact: p
               })
             }, c.id))
-          }) : /* @__PURE__ */ k("div", {
+          }) : /* @__PURE__ */ I("div", {
             className: h.expandedItems,
             children: [r.map((c) => /* @__PURE__ */ e("div", {
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(C, {
+              children: /* @__PURE__ */ e(b, {
                 item: c,
                 compact: p
               })
@@ -150,12 +149,12 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
       }),
       /* @__PURE__ */ e("div", {
         className: h.chevron,
-        children: n ? /* @__PURE__ */ e(O, { className: "size-6" }) : /* @__PURE__ */ e(F, { className: "size-6" })
+        children: n ? /* @__PURE__ */ e(z, { className: "size-6" }) : /* @__PURE__ */ e(j, { className: "size-6" })
       }),
       /* @__PURE__ */ e("div", {
         "aria-hidden": !0,
         className: h.measureLayer,
-        children: /* @__PURE__ */ k("div", {
+        children: /* @__PURE__ */ I("div", {
           className: h.measureRow,
           children: [
             s ? /* @__PURE__ */ e("div", {
@@ -168,7 +167,7 @@ function Y({ items: i, expanded: n, onToggleExpanded: d, leadSlot: s, actionSlot
             r.map((c) => /* @__PURE__ */ e("div", {
               ref: g(c.id),
               className: "shrink-0 whitespace-nowrap",
-              children: /* @__PURE__ */ e(C, {
+              children: /* @__PURE__ */ e(b, {
                 item: c,
                 compact: !0
               })

package/dist/src/tokens.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -3,7 +3,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "version": "3.78.3",
+    "version": "3.78.4",
     "type": "module",
     "sideEffects": [
         "**/*.css",

package/src/styles/color-variables/defaultTokens.css

@@ -6,6 +6,17 @@
     --colors-alpha-600: var(--colors-blue-600);
     --colors-alpha-700: var(--colors-blue-700);
     --colors-beta-100: var(--colors-red-100);
+    /* Focus-indicator shade for the three error-button *-focused-border-color rules.
+       Chosen by measurement on the rendered baseline, not by ramp position:
+         2.4.7  Focus Visible   (AA)  PASS - a ring renders where contained/outlined/text
+                                             previously painted none.
+         1.4.11 Non-text Contrast(AA) PASS - contained 8.37:1 against white on both sides
+                                             (a 1px white inset separates it from the fill,
+                                             itself 4.96:1); outlined and text 8.37:1 vs
+                                             page and 6.56:1 vs fill.
+         2.4.13 Focus Appearance(AAA) not claimed, outside this library's AA scope.
+       See docs/a11y-contrast.md (F-15) for the derivation and per-theme numbers. */
+    --colors-beta-400: var(--colors-red-700);
     --colors-beta-500: var(--colors-red-500);
     --colors-beta-600: var(--colors-red-600);
     --colors-beta-700: var(--colors-red-700);

package/src/styles/color-variables/fretexTokens.css

@@ -178,8 +178,8 @@
     --colors-button-textWhite-common-disabled-bg-color: transparent;
     --colors-button-textWhite-common-disabled-border-color: transparent;
 
-    --colors-colors-btn-bg-mini-action: var(--colors-zinc-100);
-    --colors-colors-btn-bg-mini-action-hover: var(--colors-gama-700);
+    --colors-btn-bg-mini-action: var(--colors-zinc-100);
+    --colors-btn-bg-mini-action-hover: var(--colors-gama-700);
     --colors-link-text-hover: var(--colors-red-700);
     --colors-link-text-standart: var(--colors-gray-500);
     --colors-link-text-active: var(--colors-red-700);
@@ -188,7 +188,7 @@
     --colors-app-directory-button-select-recipient-bg: var(--colors-slate-500);
     --colors-btn-task-status-bg: var(--colors-green-100);
     --colors-chat-ticket-message-bg: var(--colors-alpha-500);
-    --colors-colors-topbar-text: #ffffff;
+    --colors-topbar-text: #ffffff;
 
     --colors-menu-text-active: var(--colors-beta-700);
 }

package/src/styles/color-variables/jadeTokens.css

@@ -1,5 +1,16 @@
 [data-theme='greenish'] {
     --colors-beta-100: var(--colors-red-100);
+    /* Focus-indicator shade for the three error-button *-focused-border-color rules.
+       Chosen by measurement on the rendered baseline, not by ramp position:
+         2.4.7  Focus Visible   (AA)  PASS - a ring renders where contained/outlined/text
+                                             previously painted none.
+         1.4.11 Non-text Contrast(AA) PASS - contained 8.37:1 against white on both sides
+                                             (a 1px white inset separates it from the fill,
+                                             itself 4.96:1); outlined and text 8.37:1 vs
+                                             page and 6.56:1 vs fill.
+         2.4.13 Focus Appearance(AAA) not claimed, outside this library's AA scope.
+       See docs/a11y-contrast.md (F-15) for the derivation and per-theme numbers. */
+    --colors-beta-400: var(--colors-red-700);
     --colors-beta-500: var(--colors-red-500);
     --colors-beta-600: var(--colors-red-600);
     --colors-beta-700: var(--colors-red-700);

package/src/styles/components-colors/inputVariables.css

@@ -1,3 +1,12 @@
+/*
+ * Declared on :root as well as the theme blocks: a host page that renders without any
+ * data-theme attribute must still get valid --colors-input-* / --input-* values (otherwise every
+ * var() below is invalid-at-computed-value-time and StyledTextarea falls back to inherited or
+ * initial colors). All three themes share these values today, so listing :root alongside them is
+ * exact -- the theme selectors stay in place, and because they come later in the selector list
+ * they continue to win on equal specificity once a theme starts overriding a token.
+ */
+:root,
 [data-theme='default'],
 [data-theme='fretex'],
 [data-theme='greenish'] {
@@ -65,7 +74,7 @@
     --colors-input-notEditable-focus-bg-color: var(--colors-delta-50);
     --colors-input-notEditable-disabled-bg-color: var(--colors-delta-50);
     --colors-input-notEditable-text-color: var(--colors-delta-800);
-    --colors-input-active-hover-text-color: var(--colors-delta-800);
+    --colors-input-notEditable-hover-text-color: var(--colors-delta-800);
     --colors-input-notEditable-active-text-color: var(--colors-delta-800);
     --colors-input-notEditable-focus-text-color: var(--colors-delta-800);
     --colors-input-notEditable-disabled-text-color: var(--colors-delta-300);
@@ -95,10 +104,10 @@
     --colors-input-readOnly-focus-bg-color: transparent;
     --colors-input-readOnly-disabled-bg-color: transparent;
     --colors-input-readOnly-text-color: var(--colors-delta-800);
-    --colors-input-active-hover-text-color: var(--colors-delta-800);
+    --colors-input-readOnly-hover-text-color: var(--colors-delta-800);
     --colors-input-readOnly-active-text-color: var(--colors-delta-800);
     --colors-input-readOnly-focus-text-color: var(--colors-delta-800);
-    --colors-input-readOnly-active-text-color: var(--colors-delta-300);
+    --colors-input-readOnly-disabled-text-color: var(--colors-delta-300);
     --input-readOnly-cursor: text;
     --input-readOnly-hover-cursor: text;
     --input-readOnly-active-cursor: text;

package/tw-configs/twConfigs.json

@@ -37,7 +37,7 @@
         "delta-700": "var(--colors-delta-700)",
         "delta-800": "var(--colors-delta-800)",
         "delta-900": "var(--colors-delta-900)",
-        "delta-9000": "var(--colors-gray-9000)",
+        "delta-9000": "var(--colors-delta-9000)",
         "sigma-700": "var(--colors-sigma-700)",
         "theta-100": "var(--colors-theta-100)",
         "theta-200": "var(--colors-theta-200)",
@@ -83,11 +83,11 @@
         "btn-bg-mini-action-hover": "var(--colors-btn-bg-mini-action-hover)",
         "chat-ticket-message-bg": "var(--colors-chat-ticket-message-bg)",
         "colors-topbar-text": "var(--colors-topbar-text)",
-        "custom-grey-01": "hsl(var(--color-cardea--grey-01) / <alpha-value>)",
-        "custom-grey-02": "hsl(var(--color-cardea--grey-02) / <alpha-value>)",
-        "custom-grey-03": "hsl(var(--color-cardea--grey-03) / <alpha-value>)",
-        "custom-grey-04": "hsl(var(--color-cardea--grey-04) / <alpha-value>)",
-        "custom-grey-06": "hsl(var(--color-cardea--grey-06) / <alpha-value>)"
+        "custom-grey-01": "hsl(var(--colors-cardea--grey-01) / <alpha-value>)",
+        "custom-grey-02": "hsl(var(--colors-cardea--grey-02) / <alpha-value>)",
+        "custom-grey-03": "hsl(var(--colors-cardea--grey-03) / <alpha-value>)",
+        "custom-grey-04": "hsl(var(--colors-cardea--grey-04) / <alpha-value>)",
+        "custom-grey-06": "hsl(var(--colors-cardea--grey-06) / <alpha-value>)"
     },
     "boxShadow": {
         "ash": "-1px 8px 18px -20px black",