@oprt/react 0.1.0 → 0.2.0

package/dist/Chart/Chart.js

@@ -1092,7 +1092,7 @@ var Chart = forwardRef((allProps, ref) => {
                 variant: "ghost",
                 size: "sm",
                 className: "min-w-0 max-w-full oprt-wrap-anywhere",
-                "aria-label": variant === "heatmap" ? `${seriesNumber.get(item.id)} ${item.label}` : item.label,
+                "aria-label": `${variant === "heatmap" ? `${seriesNumber.get(item.id)} ${item.label}` : item.label}${hidden.has(item.id) ? " Hidden" : ""}`,
                 "aria-pressed": !hidden.has(item.id),
                 disabled,
                 onClick: () => {

package/dist/CopyButton/CopyButton.js

@@ -21,9 +21,28 @@ var feedbackStyles = cva("min-w-0 break-words font-sans text-oprt-base normal-ca
     }
   }
 });
+var reportedLabels = /* @__PURE__ */ new Set();
+function reportLabelWithoutVisibleText(label) {
+  if (process.env.NODE_ENV === "production" || reportedLabels.has(label)) return;
+  reportedLabels.add(label);
+  console.error(
+    JSON.stringify(
+      {
+        component: "CopyButton",
+        error: "LABEL_OMITS_VISIBLE_TEXT",
+        prop: "label",
+        received: label,
+        suggestion: 'The button shows the word "Copy", so its label must contain it (WCAG 2.5.3, Label in Name). Start the label with it: "Copy equipment ID".'
+      },
+      null,
+      2
+    )
+  );
+}
 var CopyButton = forwardRef((allProps, ref) => {
   const { value, label, onCopy, onCopyError, disabled = false, size = "md", className } = allProps;
   const [pending, setPending] = useState(false);
+  if (!/copy/i.test(label)) reportLabelWithoutVisibleText(label);
   const [feedback, setFeedback] = useState(null);
   const pendingRef = useRef(false);
   const isMounted = useIsMounted();

package/dist/CopyButton/CopyButton.manifest.js

@@ -11,7 +11,7 @@ var CopyButtonManifest = {
       label: {
         type: "string",
         required: true,
-        description: 'Accessible action name identifying the value. Feedback reads this label, then the outcome: "Copy equipment ID: copied".'
+        description: 'Accessible action name identifying the value. It must contain "Copy", the word the button shows. Feedback reads this label, then the outcome: "Copy equipment ID: copied".'
       },
       size: { type: "enum", values: ["sm", "md", "lg"], default: "md" },
       disabled: { type: "boolean", default: false },

package/dist/LayerControl/LayerControl.js

@@ -165,7 +165,7 @@ var LayerControl = forwardRef(
                       {
                         size: "sm",
                         variant: "tertiary",
-                        "aria-label": `Move ${item.label} up`,
+                        "aria-label": `Move up ${item.label}`,
                         disabled: !canMove(index, -1),
                         onClick: () => move(index, -1),
                         children: "Move up"
@@ -176,7 +176,7 @@ var LayerControl = forwardRef(
                       {
                         size: "sm",
                         variant: "tertiary",
-                        "aria-label": `Move ${item.label} down`,
+                        "aria-label": `Move down ${item.label}`,
                         disabled: !canMove(index, 1),
                         onClick: () => move(index, 1),
                         children: "Move down"

package/dist/Tooltip/Tooltip.js

@@ -23,6 +23,7 @@ import { isSingleElement, SCREEN_MARGIN, toPlacement, TOOLTIP_WIDTH } from "../_
 import { FocusableWhenUnavailableProvider } from "../_internal/unavailable.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 var PLAIN_TRIGGER = "inline-flex min-h-3u items-center border-0 bg-transparent p-0 [color:inherit] [font:inherit] [letter-spacing:inherit] underline decoration-dotted underline-offset-2 cursor-help outline-hidden focus-visible:shadow-oprt-focus";
+var CLOSE_DELAY = 150;
 var Tooltip = forwardRef(
   ({
     content,
@@ -78,7 +79,7 @@ var Tooltip = forwardRef(
         isOpen,
         onOpenChange: setOpen,
         delay: delayDuration,
-        closeDelay: 0,
+        closeDelay: CLOSE_DELAY,
         shouldCloseOnPress: !unavailable,
         children: [
           unavailable ? /* @__PURE__ */ jsx(FocusableWhenUnavailableProvider, { value: true, children: focusable }) : focusable,

package/dist/Tooltip/Tooltip.manifest.js

@@ -1,7 +1,7 @@
 // src/Tooltip/Tooltip.manifest.ts
 var TooltipManifest = {
   Tooltip: {
-    description: "Supplementary text on hover or keyboard focus of a trigger, wrapping at about 20rem. A disabled Button trigger stays focusable and announced unavailable, so focus or a tap shows the explanation. Built on React Aria Components (TooltipTrigger + Tooltip), portal'd, with a bordered surface.",
+    description: "Supplementary text on hover or keyboard focus of a trigger, wrapping at about 20rem. The pointer can move onto the tooltip without closing it; it closes 150 ms after the pointer has left both. A disabled Button trigger stays focusable and announced unavailable, so focus or a tap shows the explanation. Built on React Aria Components (TooltipTrigger + Tooltip), portal'd, with a bordered surface.",
     props: {
       side: { type: "enum", values: ["top", "right", "bottom", "left"], default: "top" },
       align: { type: "enum", values: ["start", "center", "end"], default: "center" },

package/dist/UploadQueue/UploadQueue.js

@@ -223,7 +223,7 @@ var UploadQueue = forwardRef(
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsx("p", { className: "m-0 text-oprt-text-dim", children: /* @__PURE__ */ jsx(ByteCountLabel, { value: item.sizeBytes }) }),
+                  /* @__PURE__ */ jsx("p", { className: "m-0 text-oprt-text-dim oprt-wrap-anywhere", children: /* @__PURE__ */ jsx(ByteCountLabel, { value: item.sizeBytes }) }),
                   item.message && /* @__PURE__ */ jsx("p", { className: "m-0 oprt-wrap-anywhere", children: item.message }),
                   transferring && (invalidProgress ? /* @__PURE__ */ jsx("p", { className: "m-0 text-oprt-error", children: "Invalid progress counts." }) : item.totalBytes === 0 ? /* @__PURE__ */ jsx("p", { className: "m-0 text-oprt-text-dim", children: `0${NUMBER_UNIT_SPACE}bytes total; no percentage available.` }) : /* @__PURE__ */ jsxs(Fragment, { children: [
                     /* @__PURE__ */ jsx(
@@ -233,7 +233,7 @@ var UploadQueue = forwardRef(
                         ...item.totalBytes !== void 0 && validLoaded ? { value: item.loadedBytes, max: item.totalBytes } : {}
                       }
                     ),
-                    /* @__PURE__ */ jsxs("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim", children: [
+                    /* @__PURE__ */ jsxs("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim oprt-wrap-anywhere", children: [
                       validLoaded ? `${item.loadedBytes}${NUMBER_UNIT_SPACE}bytes transferred` : "Transferred byte count unavailable",
                       item.totalBytes !== void 0 ? ` of ${item.totalBytes}${NUMBER_UNIT_SPACE}bytes` : "; total unknown",
                       "."

package/dist/index.cjs

@@ -7448,7 +7448,7 @@ var import_clsx35 = __toESM(require("clsx"), 1);
 // src/Tooltip/Tooltip.manifest.ts
 var TooltipManifest = {
   Tooltip: {
-    description: "Supplementary text on hover or keyboard focus of a trigger, wrapping at about 20rem. A disabled Button trigger stays focusable and announced unavailable, so focus or a tap shows the explanation. Built on React Aria Components (TooltipTrigger + Tooltip), portal'd, with a bordered surface.",
+    description: "Supplementary text on hover or keyboard focus of a trigger, wrapping at about 20rem. The pointer can move onto the tooltip without closing it; it closes 150 ms after the pointer has left both. A disabled Button trigger stays focusable and announced unavailable, so focus or a tap shows the explanation. Built on React Aria Components (TooltipTrigger + Tooltip), portal'd, with a bordered surface.",
     props: {
       side: { type: "enum", values: ["top", "right", "bottom", "left"], default: "top" },
       align: { type: "enum", values: ["start", "center", "end"], default: "center" },
@@ -7473,6 +7473,7 @@ var TooltipManifest = {
 // src/Tooltip/Tooltip.tsx
 var import_jsx_runtime36 = require("react/jsx-runtime");
 var PLAIN_TRIGGER = "inline-flex min-h-3u items-center border-0 bg-transparent p-0 [color:inherit] [font:inherit] [letter-spacing:inherit] underline decoration-dotted underline-offset-2 cursor-help outline-hidden focus-visible:shadow-oprt-focus";
+var CLOSE_DELAY = 150;
 var Tooltip = (0, import_react51.forwardRef)(
   ({
     content,
@@ -7528,7 +7529,7 @@ var Tooltip = (0, import_react51.forwardRef)(
         isOpen,
         onOpenChange: setOpen,
         delay: delayDuration,
-        closeDelay: 0,
+        closeDelay: CLOSE_DELAY,
         shouldCloseOnPress: !unavailable,
         children: [
           unavailable ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FocusableWhenUnavailableProvider, { value: true, children: focusable }) : focusable,
@@ -9105,7 +9106,7 @@ var Chart = (0, import_react53.forwardRef)((allProps, ref) => {
                 variant: "ghost",
                 size: "sm",
                 className: "min-w-0 max-w-full oprt-wrap-anywhere",
-                "aria-label": variant === "heatmap" ? `${seriesNumber.get(item.id)} ${item.label}` : item.label,
+                "aria-label": `${variant === "heatmap" ? `${seriesNumber.get(item.id)} ${item.label}` : item.label}${hidden.has(item.id) ? " Hidden" : ""}`,
                 "aria-pressed": !hidden.has(item.id),
                 disabled,
                 onClick: () => {
@@ -12723,7 +12724,7 @@ var CopyButtonManifest = {
       label: {
         type: "string",
         required: true,
-        description: 'Accessible action name identifying the value. Feedback reads this label, then the outcome: "Copy equipment ID: copied".'
+        description: 'Accessible action name identifying the value. It must contain "Copy", the word the button shows. Feedback reads this label, then the outcome: "Copy equipment ID: copied".'
       },
       size: { type: "enum", values: ["sm", "md", "lg"], default: "md" },
       disabled: { type: "boolean", default: false },
@@ -12769,9 +12770,28 @@ var feedbackStyles = (0, import_class_variance_authority37.cva)("min-w-0 break-w
     }
   }
 });
+var reportedLabels = /* @__PURE__ */ new Set();
+function reportLabelWithoutVisibleText(label) {
+  if (process.env.NODE_ENV === "production" || reportedLabels.has(label)) return;
+  reportedLabels.add(label);
+  console.error(
+    JSON.stringify(
+      {
+        component: "CopyButton",
+        error: "LABEL_OMITS_VISIBLE_TEXT",
+        prop: "label",
+        received: label,
+        suggestion: 'The button shows the word "Copy", so its label must contain it (WCAG 2.5.3, Label in Name). Start the label with it: "Copy equipment ID".'
+      },
+      null,
+      2
+    )
+  );
+}
 var CopyButton = (0, import_react72.forwardRef)((allProps, ref) => {
   const { value, label, onCopy, onCopyError, disabled = false, size = "md", className } = allProps;
   const [pending, setPending] = (0, import_react72.useState)(false);
+  if (!/copy/i.test(label)) reportLabelWithoutVisibleText(label);
   const [feedback, setFeedback] = (0, import_react72.useState)(null);
   const pendingRef = (0, import_react72.useRef)(false);
   const isMounted = useIsMounted();
@@ -15551,7 +15571,7 @@ var UploadQueue = (0, import_react86.forwardRef)(
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: "m-0 text-oprt-text-dim", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ByteCountLabel, { value: item.sizeBytes }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: "m-0 text-oprt-text-dim oprt-wrap-anywhere", children: /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ByteCountLabel, { value: item.sizeBytes }) }),
                   item.message && /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: "m-0 oprt-wrap-anywhere", children: item.message }),
                   transferring && (invalidProgress ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: "m-0 text-oprt-error", children: "Invalid progress counts." }) : item.totalBytes === 0 ? /* @__PURE__ */ (0, import_jsx_runtime70.jsx)("p", { className: "m-0 text-oprt-text-dim", children: `0${NUMBER_UNIT_SPACE}bytes total; no percentage available.` }) : /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)(import_jsx_runtime70.Fragment, { children: [
                     /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(
@@ -15561,7 +15581,7 @@ var UploadQueue = (0, import_react86.forwardRef)(
                         ...item.totalBytes !== void 0 && validLoaded ? { value: item.loadedBytes, max: item.totalBytes } : {}
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime70.jsxs)("p", { className: "m-0 font-mono tabular-nums text-oprt-text-dim oprt-wrap-anywhere", children: [
                       validLoaded ? `${item.loadedBytes}${NUMBER_UNIT_SPACE}bytes transferred` : "Transferred byte count unavailable",
                       item.totalBytes !== void 0 ? ` of ${item.totalBytes}${NUMBER_UNIT_SPACE}bytes` : "; total unknown",
                       "."
@@ -16813,7 +16833,7 @@ var LayerControl = (0, import_react92.forwardRef)(
                       {
                         size: "sm",
                         variant: "tertiary",
-                        "aria-label": `Move ${item.label} up`,
+                        "aria-label": `Move up ${item.label}`,
                         disabled: !canMove(index, -1),
                         onClick: () => move(index, -1),
                         children: "Move up"
@@ -16824,7 +16844,7 @@ var LayerControl = (0, import_react92.forwardRef)(
                       {
                         size: "sm",
                         variant: "tertiary",
-                        "aria-label": `Move ${item.label} down`,
+                        "aria-label": `Move down ${item.label}`,
                         disabled: !canMove(index, 1),
                         onClick: () => move(index, 1),
                         children: "Move down"
@@ -17621,7 +17641,7 @@ var PlaybackControlsManifest = {
 };
 
 // package.json
-var version3 = "0.1.0";
+var version3 = "0.2.0";
 
 // src/version.ts
 var VERSION = version3;

package/dist/version.js

@@ -1,5 +1,5 @@
 // package.json
-var version = "0.1.0";
+var version = "0.2.0";
 
 // src/version.ts
 var VERSION = version;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oprt/react",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "React components for operational interfaces: command, control and industrial software. 75 component families with interactive behavior from React Aria, styled with Tailwind CSS 4.",
   "keywords": [
     "design-system",
@@ -50,7 +50,7 @@
     "react-aria": "^3.51.0",
     "react-aria-components": "^1.20.0",
     "@oprt/icons": "0.1.0",
-    "@oprt/tokens": "0.1.0"
+    "@oprt/tokens": "0.2.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",