@uniformdev/design-system 20.7.1-alpha.18 → 20.7.1-alpha.26

package/dist/esm/index.js

@@ -1563,6 +1563,9 @@ function useShortcut({
   const handle = useCallback(
     (e) => {
       if (disabled2) {
+        if (disabled2 === "silent") {
+          return;
+        }
         toast.info(`Shortcut ${getFormattedShortcut(shortcut).join("")} is currently disabled`);
         return;
       }
@@ -10480,6 +10483,7 @@ var ObjectGridItemMediaInner = css77`
   flex: 1;
   overflow: hidden;
   height: 100%;
+  z-index: 0;
 `;
 var ObjectGridItemContentWrapper = css77`
   display: grid;
@@ -10660,8 +10664,8 @@ var ObjectGridItemCardCover = (props) => {
     ) });
   }
   if ("icon" in props && props.icon) {
-    const { icon, iconColor } = props;
-    return /* @__PURE__ */ jsx101("div", { css: CoverContainer, children: /* @__PURE__ */ jsxs67("div", { css: CoverIconWrapper, "data-testid": "object-grid-item-thumbnail", ...props, children: [
+    const { icon, iconColor, ...rest } = props;
+    return /* @__PURE__ */ jsx101("div", { css: CoverContainer, children: /* @__PURE__ */ jsxs67("div", { css: CoverIconWrapper, "data-testid": "object-grid-item-thumbnail", ...rest, children: [
       /* @__PURE__ */ jsx101(Icon, { icon, iconColor: iconColor != null ? iconColor : "currentColor", css: CoverIconGhost }),
       /* @__PURE__ */ jsx101(Icon, { icon, iconColor: iconColor != null ? iconColor : "currentColor", size: 48 })
     ] }) });
@@ -10984,13 +10988,21 @@ var ObjectListItem2 = ({ minContainerQueryWidth = "34rem", ...props }) => {
             css: [
               ObjectListItemContentWrapper,
               `${cq(minContainerQueryWidth)} {
-            grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
+            grid-template-columns: ${cover ? "minmax(0, auto)" : ""} minmax(0, 1fr) minmax(0, auto);
           }`
             ],
             children: [
-              /* @__PURE__ */ jsx106(HorizontalRhythm, { gap: "sm", align: "center", children: cover }),
+              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", children: header2 }),
+                /* @__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 })
@@ -15533,6 +15545,7 @@ var SegmentedControl = ({
           }
           const text = option.label ? option.label : option.icon ? null : String(option.value);
           const isDisabled = disabled2 || option.disabled;
+          const isChecked = option.value === value;
           return /* @__PURE__ */ jsx134(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx134(
             "div",
             {
@@ -15542,7 +15555,7 @@ var SegmentedControl = ({
                 "label",
                 {
                   css: [
-                    segmentedControlLabelStyles(option.value === value, isDisabled),
+                    segmentedControlLabelStyles(isChecked, isDisabled),
                     sizeStyles,
                     isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
                   ],
@@ -15554,7 +15567,7 @@ var SegmentedControl = ({
                         type: "radio",
                         name,
                         value: index,
-                        checked: option.value === value,
+                        checked: isChecked,
                         onChange: onOptionChange,
                         disabled: isDisabled
                       }

package/dist/index.d.mts

@@ -384,8 +384,12 @@ type UseShortcutOptions = {
     doNotPreventDefault?: boolean;
     /** Whether the shortcut will activate with a form field in focus */
     activeWhenEditing?: boolean;
-    /** When true, the shortcut is disabled. The result will also reflect this state, which may disable attached menus, buttons, etc */
-    disabled?: boolean;
+    /**
+     * When true or 'silent', the shortcut is disabled. When undefined or false, it is enabled.
+     * The result will also reflect this state, which may disable attached menus, buttons, etc
+     * 'silent' will not show a toast notification when the shortcut is invoked while disabled.
+     */
+    disabled?: boolean | 'silent';
 };
 type ShortcutReference = {
     shortcut: string;

package/dist/index.d.ts

@@ -384,8 +384,12 @@ type UseShortcutOptions = {
     doNotPreventDefault?: boolean;
     /** Whether the shortcut will activate with a form field in focus */
     activeWhenEditing?: boolean;
-    /** When true, the shortcut is disabled. The result will also reflect this state, which may disable attached menus, buttons, etc */
-    disabled?: boolean;
+    /**
+     * When true or 'silent', the shortcut is disabled. When undefined or false, it is enabled.
+     * The result will also reflect this state, which may disable attached menus, buttons, etc
+     * 'silent' will not show a toast notification when the shortcut is invoked while disabled.
+     */
+    disabled?: boolean | 'silent';
 };
 type ShortcutReference = {
     shortcut: string;

package/dist/index.js

@@ -3253,6 +3253,9 @@ function useShortcut({
   const handle = (0, import_react14.useCallback)(
     (e) => {
       if (disabled2) {
+        if (disabled2 === "silent") {
+          return;
+        }
         import_react_toastify.toast.info(`Shortcut ${getFormattedShortcut(shortcut).join("")} is currently disabled`);
         return;
       }
@@ -12339,6 +12342,7 @@ var ObjectGridItemMediaInner = import_react118.css`
   flex: 1;
   overflow: hidden;
   height: 100%;
+  z-index: 0;
 `;
 var ObjectGridItemContentWrapper = import_react118.css`
   display: grid;
@@ -12523,8 +12527,8 @@ var ObjectGridItemCardCover = (props) => {
     ) });
   }
   if ("icon" in props && props.icon) {
-    const { icon, iconColor } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { css: CoverContainer, children: /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { css: CoverIconWrapper, "data-testid": "object-grid-item-thumbnail", ...props, children: [
+    const { icon, iconColor, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("div", { css: CoverContainer, children: /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)("div", { css: CoverIconWrapper, "data-testid": "object-grid-item-thumbnail", ...rest, children: [
       /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Icon, { icon, iconColor: iconColor != null ? iconColor : "currentColor", css: CoverIconGhost }),
       /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(Icon, { icon, iconColor: iconColor != null ? iconColor : "currentColor", size: 48 })
     ] }) });
@@ -12859,13 +12863,21 @@ var ObjectListItem2 = ({ minContainerQueryWidth = "34rem", ...props }) => {
             css: [
               ObjectListItemContentWrapper,
               `${cq(minContainerQueryWidth)} {
-            grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
+            grid-template-columns: ${cover ? "minmax(0, auto)" : ""} minmax(0, 1fr) minmax(0, auto);
           }`
             ],
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(HorizontalRhythm, { gap: "sm", align: "center", children: cover }),
+              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", children: header2 }),
+                /* @__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 })
@@ -17378,6 +17390,7 @@ var SegmentedControl = ({
           }
           const text = option.label ? option.label : option.icon ? null : String(option.value);
           const isDisabled = disabled2 || option.disabled;
+          const isChecked = option.value === value;
           return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
             "div",
             {
@@ -17387,7 +17400,7 @@ var SegmentedControl = ({
                 "label",
                 {
                   css: [
-                    segmentedControlLabelStyles(option.value === value, isDisabled),
+                    segmentedControlLabelStyles(isChecked, isDisabled),
                     sizeStyles,
                     isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
                   ],
@@ -17399,7 +17412,7 @@ var SegmentedControl = ({
                         type: "radio",
                         name,
                         value: index,
-                        checked: option.value === value,
+                        checked: isChecked,
                         onChange: onOptionChange,
                         disabled: isDisabled
                       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "20.7.1-alpha.18+ca3be5fdae",
+  "version": "20.7.1-alpha.26+03c49728b3",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -26,8 +26,8 @@
     "@storybook/theming": "^8.3.3",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
-    "@uniformdev/canvas": "^20.7.1-alpha.18+ca3be5fdae",
-    "@uniformdev/richtext": "^20.7.1-alpha.18+ca3be5fdae",
+    "@uniformdev/canvas": "^20.7.1-alpha.26+03c49728b3",
+    "@uniformdev/richtext": "^20.7.1-alpha.26+03c49728b3",
     "autoprefixer": "10.4.16",
     "hygen": "6.2.11",
     "postcss": "8.4.47",
@@ -55,7 +55,7 @@
     "@lexical/table": "0.25.0",
     "@lexical/utils": "0.25.0",
     "@monaco-editor/react": "4.6.0",
-    "@react-icons/all-files": "https://github.com/react-icons/react-icons/releases/download/v5.2.1/react-icons-all-files-5.2.1.tgz",
+    "@react-icons/all-files": "https://github.com/react-icons/react-icons/releases/download/v5.5.0/react-icons-all-files-5.5.0.tgz",
     "fast-equals": "^5.0.1",
     "lexical": "0.25.0",
     "monaco-editor": "0.50.0",
@@ -77,5 +77,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "ca3be5fdae62d8b6811e6efe6bba6620f9d4c680"
+  "gitHead": "03c49728b3fb82b57e64265bde2f950f12ee7cb6"
 }