@uniformdev/design-system 20.12.1-alpha.23 → 20.12.1-alpha.28

package/dist/esm/index.js

@@ -6906,6 +6906,7 @@ var counterContainer = (bgColor, hasIcon) => css47`
 var counterZeroValue = css47`
   background: var(--gray-800);
   border-radius: var(--rounded-full);
+  display: block;
   width: 2px;
   height: 2px;
 `;
@@ -7926,7 +7927,7 @@ var DrawerInner = ({
   instanceKey,
   onRequestClose,
   leftAligned,
-  width,
+  width = "medium",
   testId = "side-dialog"
 }) => {
   const { registerDrawer, unregisterDrawer, providerId } = useDrawer();
@@ -8074,9 +8075,13 @@ var DrawerRenderer = ({
     if (withoutFluidWidth) {
       return rendererWidth;
     }
-    const drawerWidths = [rendererWidth, ...drawersToRender.map(({ width: width2 }) => width2)].filter(
-      (v) => typeof v === "string"
-    );
+    const drawerWidths = [
+      rendererWidth,
+      ...drawersToRender.map(({ width: width2 }) => {
+        var _a2;
+        return width2 ? (_a2 = drawerWidth[width2]) != null ? _a2 : width2 : null;
+      })
+    ].filter((v) => typeof v === "string");
     return `max(${drawerWidths.join()})`;
   }, [drawersToRender, width, withoutFluidWidth]);
   if (drawersToRender.length === 0) {
@@ -8137,6 +8142,7 @@ var DrawerWrapper = ({
       {
         css: [drawerWrapperStyles, leftAligned ? drawerWrapperLeftAlignedStyles : null],
         style: { width: calculatedWidth, minWidth, maxWidth },
+        "data-testid": "drawer-wrapper",
         children
       }
     )
@@ -8315,7 +8321,7 @@ function Image({
       if (src === "") {
         setLoading(false);
       } else {
-        const url = String(src).startsWith("//") ? `${location.protocol}${src}` : String(src);
+        const url = String(src).startsWith("//") ? `https://${src}` : String(src);
         if (!isValidUrl(url, { allowRelative: true, isSecure: true })) {
           throw Error(errorText);
         }
@@ -8909,6 +8915,10 @@ var Tile = css63`
   &[aria-disabled='true'],
   &:disabled {
     pointer-events: none;
+
+    > * {
+      opacity: 0.5;
+    }
   }
 `;
 var LinkTile = css63`
@@ -11084,18 +11094,26 @@ var ObjectListItem2 = ({ minContainerQueryWidth = "34rem", ...props }) => {
             ],
             children: [
               cover ? /* @__PURE__ */ jsx106(HorizontalRhythm, { gap: "sm", align: "center", children: cover }) : null,
-              /* @__PURE__ */ jsxs71(VerticalRhythm, { gap: "0", justify: renderAs === "multi" ? "flex-start" : "center", children: [
-                /* @__PURE__ */ jsx106(
-                  HorizontalRhythm,
-                  {
-                    gap: "xs",
-                    align: renderAs === "multi" ? "flex-start" : "center",
-                    "data-testid": "title",
-                    children: header2
-                  }
-                ),
-                renderAs === "multi" ? props.children : null
-              ] }),
+              /* @__PURE__ */ jsxs71(
+                VerticalRhythm,
+                {
+                  gap: "0",
+                  justify: renderAs === "multi" ? "flex-start" : "center",
+                  "data-testid": "title-container",
+                  children: [
+                    /* @__PURE__ */ jsx106(
+                      HorizontalRhythm,
+                      {
+                        gap: "xs",
+                        align: renderAs === "multi" ? "flex-start" : "center",
+                        "data-testid": "title",
+                        children: header2
+                      }
+                    ),
+                    renderAs === "multi" ? props.children : null
+                  ]
+                }
+              ),
               /* @__PURE__ */ jsx106(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: rightSlot })
             ]
           }
@@ -11169,7 +11187,7 @@ var ObjectListItemHeading2 = ({
   return /* @__PURE__ */ jsxs72("div", { css: ObjectListItemHeading, ...props, children: [
     beforeHeadingSlot ? /* @__PURE__ */ jsx109(HorizontalRhythm, { gap: "xs", align: "center", children: beforeHeadingSlot }) : null,
     /* @__PURE__ */ jsxs72(HorizontalRhythm, { css: ObjectListItemHeadingAfterWrapper, gap: "xs", align: "flex-start", children: [
-      /* @__PURE__ */ jsx109("div", { role: "heading", children: heading }),
+      /* @__PURE__ */ jsx109("div", { role: "heading", "data-testid": "reference-item-name", children: heading }),
       afterHeadingSlot
     ] })
   ] });
@@ -15627,8 +15645,8 @@ var SegmentedControl = ({
           segmentedControlStyles,
           orientation === "vertical" ? segmentedControlVerticalStyles : void 0
         ],
-        ...props,
         "data-testid": "segmented-control",
+        ...props,
         children: options.map((option, index) => {
           var _a;
           if (!option) {

package/dist/index.js

@@ -8688,6 +8688,7 @@ var counterContainer = (bgColor, hasIcon) => import_react69.css`
 var counterZeroValue = import_react69.css`
   background: var(--gray-800);
   border-radius: var(--rounded-full);
+  display: block;
   width: 2px;
   height: 2px;
 `;
@@ -9717,7 +9718,7 @@ var DrawerInner = ({
   instanceKey,
   onRequestClose,
   leftAligned,
-  width,
+  width = "medium",
   testId = "side-dialog"
 }) => {
   const { registerDrawer, unregisterDrawer, providerId } = useDrawer();
@@ -9870,9 +9871,13 @@ var DrawerRenderer = ({
     if (withoutFluidWidth) {
       return rendererWidth;
     }
-    const drawerWidths = [rendererWidth, ...drawersToRender.map(({ width: width2 }) => width2)].filter(
-      (v) => typeof v === "string"
-    );
+    const drawerWidths = [
+      rendererWidth,
+      ...drawersToRender.map(({ width: width2 }) => {
+        var _a2;
+        return width2 ? (_a2 = drawerWidth[width2]) != null ? _a2 : width2 : null;
+      })
+    ].filter((v) => typeof v === "string");
     return `max(${drawerWidths.join()})`;
   }, [drawersToRender, width, withoutFluidWidth]);
   if (drawersToRender.length === 0) {
@@ -9933,6 +9938,7 @@ var DrawerWrapper = ({
       {
         css: [drawerWrapperStyles, leftAligned ? drawerWrapperLeftAlignedStyles : null],
         style: { width: calculatedWidth, minWidth, maxWidth },
+        "data-testid": "drawer-wrapper",
         children
       }
     )
@@ -10123,7 +10129,7 @@ function Image({
       if (src === "") {
         setLoading(false);
       } else {
-        const url = String(src).startsWith("//") ? `${location.protocol}${src}` : String(src);
+        const url = String(src).startsWith("//") ? `https://${src}` : String(src);
         if (!isValidUrl(url, { allowRelative: true, isSecure: true })) {
           throw Error(errorText);
         }
@@ -10739,6 +10745,10 @@ var Tile = import_react96.css`
   &[aria-disabled='true'],
   &:disabled {
     pointer-events: none;
+
+    > * {
+      opacity: 0.5;
+    }
   }
 `;
 var LinkTile = import_react96.css`
@@ -12961,18 +12971,26 @@ var ObjectListItem2 = ({ minContainerQueryWidth = "34rem", ...props }) => {
             ],
             children: [
               cover ? /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(HorizontalRhythm, { gap: "sm", align: "center", children: cover }) : null,
-              /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(VerticalRhythm, { gap: "0", justify: renderAs === "multi" ? "flex-start" : "center", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
-                  HorizontalRhythm,
-                  {
-                    gap: "xs",
-                    align: renderAs === "multi" ? "flex-start" : "center",
-                    "data-testid": "title",
-                    children: header2
-                  }
-                ),
-                renderAs === "multi" ? props.children : null
-              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
+                VerticalRhythm,
+                {
+                  gap: "0",
+                  justify: renderAs === "multi" ? "flex-start" : "center",
+                  "data-testid": "title-container",
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+                      HorizontalRhythm,
+                      {
+                        gap: "xs",
+                        align: renderAs === "multi" ? "flex-start" : "center",
+                        "data-testid": "title",
+                        children: header2
+                      }
+                    ),
+                    renderAs === "multi" ? props.children : null
+                  ]
+                }
+              ),
               /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: rightSlot })
             ]
           }
@@ -13052,7 +13070,7 @@ var ObjectListItemHeading2 = ({
   return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { css: ObjectListItemHeading, ...props, children: [
     beforeHeadingSlot ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(HorizontalRhythm, { gap: "xs", align: "center", children: beforeHeadingSlot }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(HorizontalRhythm, { css: ObjectListItemHeadingAfterWrapper, gap: "xs", align: "flex-start", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { role: "heading", children: heading }),
+      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { role: "heading", "data-testid": "reference-item-name", children: heading }),
       afterHeadingSlot
     ] })
   ] });
@@ -17474,8 +17492,8 @@ var SegmentedControl = ({
           segmentedControlStyles,
           orientation === "vertical" ? segmentedControlVerticalStyles : void 0
         ],
-        ...props,
         "data-testid": "segmented-control",
+        ...props,
         children: options.map((option, index) => {
           var _a;
           if (!option) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "20.12.1-alpha.23+36df23cbe9",
+  "version": "20.12.1-alpha.28+28cc2dd35d",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "exports": {
@@ -23,8 +23,8 @@
     "build": "tsup",
     "dev": "tsup --watch",
     "clean": "rimraf dist",
-    "test": "jest",
-    "test:coverage": "jest --coverage",
+    "test": "vitest",
+    "test:coverage": "vitest run --coverage",
     "lint": "eslint \"src/**/*.{js,ts,tsx}\"",
     "format": "prettier --write \"src/**/*.{js,ts,tsx}\"",
     "create:component": "hygen component with-prompt",
@@ -38,15 +38,17 @@
     "@storybook/theming": "^8.3.3",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
-    "@uniformdev/canvas": "^20.12.1-alpha.23+36df23cbe9",
-    "@uniformdev/richtext": "^20.12.1-alpha.23+36df23cbe9",
+    "@uniformdev/canvas": "^20.12.1-alpha.28+28cc2dd35d",
+    "@uniformdev/richtext": "^20.12.1-alpha.28+28cc2dd35d",
+    "@vitest/coverage-v8": "^3.1.2",
     "autoprefixer": "10.4.21",
     "hygen": "6.2.11",
     "postcss": "8.5.3",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-select-event": "^5.5.1",
-    "tsup": "8.3.0"
+    "tsup": "8.3.0",
+    "vitest": "^3.1.2"
   },
   "dependencies": {
     "@ariakit/react": "^0.4.15",
@@ -89,5 +91,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "36df23cbe9ca246137efcf2f4a57e04d029406cc"
+  "gitHead": "28cc2dd35d9b1ec7c31e72bd0c562341765cef9d"
 }