@dmsi/wedgekit-react 0.0.494 → 0.0.496

package/dist/{chunk-BYY2NTJH.js → chunk-2A7H5GVB.js}

@@ -24,13 +24,13 @@ import {
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "./chunk-QBSEKZWX.js";
+} from "./chunk-ZKTHUXKS.js";
 import {
   Menu
 } from "./chunk-TCMOGTPB.js";
 import {
   MenuOption
-} from "./chunk-IPAKWF2V.js";
+} from "./chunk-5R4C5F63.js";
 import {
   Search
 } from "./chunk-RQRR4FEF.js";

package/dist/{chunk-IPAKWF2V.js → chunk-5R4C5F63.js}

@@ -1,6 +1,9 @@
 import {
   Label
 } from "./chunk-AL5QIRY3.js";
+import {
+  Caption
+} from "./chunk-BTKWHCUE.js";
 import {
   useMatchesMobile
 } from "./chunk-URYQ24NF.js";
@@ -13,7 +16,8 @@ import {
 import {
   baseTransition,
   componentGap,
-  componentPadding
+  componentPadding,
+  layoutGroupGap
 } from "./chunk-IXR65MOU.js";
 import {
   __spreadProps,
@@ -48,7 +52,8 @@ var MenuOption = ({
   mobilePositionTo,
   highlightMatchingText = false,
   menuValue,
-  onMouseMove
+  onMouseMove,
+  small = false
 }) => {
   const uniqueId = useId();
   const internalRef = useRef(null);
@@ -100,7 +105,7 @@ var MenuOption = ({
   const actionDisabledStyles = variant === "action" && disabled && clsx("text-text-action-disabled");
   const disabledStyles = disabled && clsx("bg-transparent cursor-default pointer-events-none");
   const processChildren = typeof children === "string" && highlightMatchingText ? highlightMatch(children, menuValue) : children;
-  const renderChildren = typeof children === "object" ? children : variant === "action" ? /* @__PURE__ */ jsx(Label, { padded: true, className: textLabelStyles, children: processChildren }) : /* @__PURE__ */ jsx(Paragraph, { padded: true, className: textLabelStyles, children: processChildren });
+  const renderChildren = typeof children === "object" ? children : variant === "action" ? /* @__PURE__ */ jsx(Label, { padded: true, className: textLabelStyles, children: processChildren }) : !small ? /* @__PURE__ */ jsx(Paragraph, { padded: true, className: textLabelStyles, children: processChildren }) : /* @__PURE__ */ jsx(Caption, { padded: true, className: textLabelStyles, children: processChildren });
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(
       "div",
@@ -109,16 +114,17 @@ var MenuOption = ({
         "data-testid": testid,
         ref: actualRef,
         className: clsx(
-          "flex items-center cursor-pointer w-full text-left relative outline-none",
+          "flex cursor-pointer w-full text-left relative outline-none",
           svgStyles,
-          componentGap,
+          small ? layoutGroupGap : componentGap,
           componentPadding,
           baseTransition,
           normalStyles,
           normalDisabledStyles,
           actionStyles,
           actionDisabledStyles,
-          disabledStyles
+          disabledStyles,
+          { "items-center": !small }
         ),
         "data-value": value || children,
         onClick: () => {
@@ -135,7 +141,7 @@ var MenuOption = ({
         role: "menuitem",
         "aria-haspopup": subMenu ? "menu" : void 0,
         children: [
-          before && /* @__PURE__ */ jsx("div", { className: "shrink-0 flex items-center", children: before }),
+          before && /* @__PURE__ */ jsx("div", { className: clsx("shrink-0", { "items-center flex": !small }), children: before }),
           renderChildren,
           renderAfterProp()
         ]

package/dist/chunk-BTKWHCUE.js

@@ -0,0 +1,137 @@
+import {
+  Icon
+} from "./chunk-NKUETCDA.js";
+import {
+  typography
+} from "./chunk-IXR65MOU.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-ORMEWXMH.js";
+
+// src/components/Caption.tsx
+import clsx from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Caption = (_a) => {
+  var _b = _a, {
+    className,
+    children,
+    as = "span",
+    style = "default",
+    color,
+    align,
+    id,
+    testid,
+    marginTopDesktop
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children",
+    "as",
+    "style",
+    "color",
+    "align",
+    "id",
+    "testid",
+    "marginTopDesktop"
+  ]);
+  const Element = as;
+  return /* @__PURE__ */ jsxs("div", { id, "data-testid": testid, className: "flex gap-1", children: [
+    /* @__PURE__ */ jsx(
+      WhichIcon,
+      {
+        id,
+        testid,
+        style,
+        size: 16,
+        className: "mt-[3px] desktop:mt-0"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Element,
+      __spreadProps(__spreadValues({
+        id: id ? `${id}-text` : void 0,
+        "data-testid": testid ? `${testid}-text` : void 0,
+        className: clsx(
+          typography.caption.replace("text-text-primary-normal", ""),
+          (style === "default" || style === "info") && "text-text-secondary-normal",
+          style === "success" && "text-text-success-normal",
+          style === "warning" && "text-text-warning-normal",
+          style === "error" && "text-text-critical-normal",
+          align === "left" && "text-left",
+          align === "center" && "text-center",
+          align === "right" && "text-right",
+          className,
+          marginTopDesktop && `desktop:mt-px`
+        )
+      }, props), {
+        style: {
+          color: color ? `var(--color-${color})` : void 0
+        },
+        children
+      })
+    )
+  ] });
+};
+var WhichIcon = ({
+  style,
+  size,
+  className,
+  id,
+  testid
+}) => {
+  if (style === "success") {
+    return /* @__PURE__ */ jsx("span", { className: "text-icon-success-normal contents", children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        id: id ? `${id}-icon` : void 0,
+        testid: testid ? `${testid}-icon` : void 0,
+        className,
+        name: "check_circle",
+        size
+      }
+    ) });
+  }
+  if (style === "warning") {
+    return /* @__PURE__ */ jsx("span", { className: "text-icon-warning-normal contents", children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        id: id ? `${id}-icon` : void 0,
+        testid: testid ? `${testid}-icon` : void 0,
+        className,
+        name: "warning",
+        size
+      }
+    ) });
+  }
+  if (style === "error") {
+    return /* @__PURE__ */ jsx("span", { className: "text-icon-critical-normal contents", children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        id: id ? `${id}-icon` : void 0,
+        testid: testid ? `${testid}-icon` : void 0,
+        className,
+        name: "info",
+        size
+      }
+    ) });
+  }
+  if (style === "info") {
+    return /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ jsx(
+      Icon,
+      {
+        id: id ? `${id}-icon` : void 0,
+        testid: testid ? `${testid}-icon` : void 0,
+        className,
+        name: "info",
+        size
+      }
+    ) });
+  }
+  return null;
+};
+Caption.displayName = "Caption";
+
+export {
+  Caption
+};

package/dist/{chunk-ETAEB3TA.js → chunk-L3BXRDLP.js}

@@ -2,14 +2,20 @@
 import { jsx } from "react/jsx-runtime";
 function SkeletonParagraph({
   className = "",
-  heightClassName = "h-6"
+  heightClassName = "h-6",
+  size = "large"
 }) {
+  const sizeClassMap = {
+    small: "min-w-10 w-1/4",
+    medium: "min-w-20 w-1/2",
+    large: "min-w-32 w-full"
+  };
   return /* @__PURE__ */ jsx(
     "div",
     {
       "aria-label": "Loading content",
       role: "status",
-      className: `skeleton-paragraph ${heightClassName} w-full min-w-32 rounded-xs ${className}`
+      className: `skeleton-paragraph ${heightClassName} ${sizeClassMap[size]} rounded-xs ${className}`
     }
   );
 }

package/dist/chunk-Y5GD2FJA.js

@@ -0,0 +1,32 @@
+import {
+  ImagePlaceholder
+} from "./chunk-QVWYTQKL.js";
+
+// src/components/SearchResultImage/index.tsx
+import { useState } from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
+function SearchResultImage({
+  width = 20,
+  height = 20,
+  src,
+  alt
+}) {
+  const [imageError, setImageError] = useState(false);
+  const showPlaceholder = imageError || !src;
+  return /* @__PURE__ */ jsx(Fragment, { children: showPlaceholder ? /* @__PURE__ */ jsx(ImagePlaceholder, { width, height }) : /* @__PURE__ */ jsx(
+    "img",
+    {
+      src,
+      alt,
+      width,
+      height,
+      draggable: false,
+      loading: "lazy",
+      onError: () => setImageError(true)
+    }
+  ) });
+}
+
+export {
+  SearchResultImage
+};

package/dist/{chunk-QBSEKZWX.js → chunk-ZKTHUXKS.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-DVU5XV7L.js";
 import {
   MenuOption
-} from "./chunk-IPAKWF2V.js";
+} from "./chunk-5R4C5F63.js";
 import {
   Search
 } from "./chunk-RQRR4FEF.js";