@uniformdev/design-system 19.196.0 → 19.196.1-alpha.8

package/dist/esm/{importedIcons-XEGXOSVC.js → importedIcons-SI6R3MYO.js}

@@ -645,6 +645,11 @@ import { CgYinyang } from "@react-icons/all-files/cg/CgYinyang";
 import { CgZoomIn } from "@react-icons/all-files/cg/CgZoomIn";
 import { CgZoomOut } from "@react-icons/all-files/cg/CgZoomOut";
 import { MdCopyAll } from "@react-icons/all-files/md/MdCopyAll";
+import { TbDeviceIpad } from "@react-icons/all-files/tb/TbDeviceIpad";
+import { TbDeviceMobile } from "@react-icons/all-files/tb/TbDeviceMobile";
+import { TbDeviceMobileRotated } from "@react-icons/all-files/tb/TbDeviceMobileRotated";
+import { TbDeviceTablet } from "@react-icons/all-files/tb/TbDeviceTablet";
+import { TbDeviceTv } from "@react-icons/all-files/tb/TbDeviceTv";
 var importedIcons = {
   "add-r": CgAddR,
   add: CgAdd,
@@ -1289,7 +1294,12 @@ var importedIcons = {
   "work-alt": CgWorkAlt,
   yinyang: CgYinyang,
   "zoom-in": CgZoomIn,
-  "zoom-out": CgZoomOut
+  "zoom-out": CgZoomOut,
+  "device-mobile": TbDeviceMobile,
+  "device-tablet": TbDeviceTablet,
+  "device-tv": TbDeviceTv,
+  "device-ipad": TbDeviceIpad,
+  "device-mobile-rotated": TbDeviceMobileRotated
 };
 export {
   importedIcons

package/dist/esm/index.js

@@ -2156,7 +2156,7 @@ function IconsProvider({ children }) {
   const [isLoading, setIsLoading] = useState2(true);
   const [iconsMap, setIconsMap] = useState2({});
   const initializeIconsMap = async () => {
-    const { importedIcons } = await import("./importedIcons-XEGXOSVC.js");
+    const { importedIcons } = await import("./importedIcons-SI6R3MYO.js");
     setIconsMap({ ...importedIcons, ...customIcons });
     setIsLoading(false);
   };
@@ -13029,7 +13029,7 @@ var Input = React10.forwardRef(
                       errorMessage ? inputError : void 0,
                       icon ? inputWithIcon : ""
                     ],
-                    "aria-label": !showLabel ? label : void 0,
+                    "aria-label": showLabel || typeof label !== "string" ? void 0 : label,
                     className: typeof classNameControl === "string" ? classNameControl : "",
                     ...props,
                     ref
@@ -13925,7 +13925,7 @@ import { css as css39 } from "@emotion/react";
 var buttonSizeBase = css39`
   --icon-padding: var(--spacing-xs);
   --svg-size: 1rem;
-  --line-offset: -5px;
+  --line-offset: -1px;
   font-size: var(--fs-sm);
 
   button {
@@ -15149,6 +15149,9 @@ var ChipOutlined = css49`
     border-color: var(--outline-color);
   }
 `;
+var ChipDisabled = css49`
+  opacity: var(--opacity-50);
+`;
 
 // src/components/Chip/Chip.tsx
 import { Fragment as Fragment9, jsx as jsx62, jsxs as jsxs38 } from "@emotion/react/jsx-runtime";
@@ -15168,6 +15171,7 @@ var Chip = ({
   theme = "accent-light",
   variant = "solid",
   chipAction,
+  isDisabled = false,
   as = "span",
   ...props
 }) => {
@@ -15184,7 +15188,8 @@ var Chip = ({
         ChipContainer,
         chipSize[size],
         chipTheme[theme],
-        variant === "outlined" ? ChipOutlined : void 0
+        variant === "outlined" ? ChipOutlined : void 0,
+        isDisabled ? ChipDisabled : void 0
       ],
       ...props,
       children: [
@@ -18637,8 +18642,9 @@ var modalContentStyles = css80`
   border-radius: var(--rounded-sm);
   ${scrollbarStyles}
 `;
-var modalDialogWrapper = css80`
-  padding: 0 var(--spacing-lg) var(--spacing-md);
+var modalDialogWrapper = (hasCloseButton) => css80`
+  height: 100%;
+  padding: ${hasCloseButton ? 0 : "var(--spacing-md)"} var(--spacing-lg) var(--spacing-md);
 `;
 var modalDialogInnerStyles = css80`
   // we need to override the gap of the modalInnerStyles when using a modal dialog
@@ -18662,8 +18668,10 @@ var Modal = React20.forwardRef(
     modalSize = "lg",
     withoutContentPadding = false,
     withoutContentBackground = false,
+    disableBodyScroll = false,
     ...modalProps
   }, ref) => {
+    const mouseDownInsideModal = useRef9(false);
     const dialogRef = useRef9(null);
     const size = {
       sm: modalSizeSmall,
@@ -18672,7 +18680,7 @@ var Modal = React20.forwardRef(
     };
     useShortcut({
       handler: () => {
-        onRequestClose();
+        onRequestClose == null ? void 0 : onRequestClose();
       },
       shortcut: "escape"
     });
@@ -18705,9 +18713,25 @@ var Modal = React20.forwardRef(
           }
         },
         css: [modalStyles, !width ? size[modalSize] : void 0],
-        style: { width, height: height === "auto" ? "min-content" : height },
+        style: {
+          width,
+          height: height === "auto" ? "min-content" : height,
+          // allows menus rendered in the PortalContext to overflow the modal contents
+          // (internal scrolling of contents is handled on a child element)
+          overflow: "visible"
+        },
         "data-testid": "side-dialog",
-        onClick: onRequestClose,
+        onClick: () => {
+          if (mouseDownInsideModal.current) {
+            return;
+          }
+          onRequestClose == null ? void 0 : onRequestClose();
+        },
+        onMouseUp: () => {
+          setTimeout(() => {
+            mouseDownInsideModal.current = false;
+          });
+        },
         onCancel: (e) => {
           e.preventDefault();
         },
@@ -18717,10 +18741,13 @@ var Modal = React20.forwardRef(
           {
             css: [modalInnerStyles, { height: height === "auto" ? "auto" : "100%" }],
             onClick: (e) => e.stopPropagation(),
+            onMouseDown: () => {
+              mouseDownInsideModal.current = true;
+            },
             children: [
-              /* @__PURE__ */ jsxs67("div", { css: modalHeaderStyles, children: [
-                !header2 ? null : /* @__PURE__ */ jsx102("div", { css: modalHeaderHeaderStyles, children: header2 }),
-                /* @__PURE__ */ jsx102(
+              header2 || onRequestClose ? /* @__PURE__ */ jsxs67("div", { css: modalHeaderStyles, children: [
+                header2 ? /* @__PURE__ */ jsx102("div", { css: modalHeaderHeaderStyles, children: header2 }) : null,
+                onRequestClose ? /* @__PURE__ */ jsx102(
                   Button,
                   {
                     type: "button",
@@ -18731,15 +18758,16 @@ var Modal = React20.forwardRef(
                     "data-testid": "close-dialog",
                     children: /* @__PURE__ */ jsx102(Icon, { icon: CgClose4, iconColor: "currentColor", size: 24 })
                   }
-                )
-              ] }),
+                ) : null
+              ] }) : null,
               /* @__PURE__ */ jsx102(
                 "div",
                 {
                   css: [
                     modalContentStyles,
-                    !withoutContentPadding ? null : { padding: 0 },
-                    !withoutContentBackground ? null : { background: "transparent" }
+                    withoutContentPadding ? { padding: 0 } : null,
+                    withoutContentBackground ? { background: "transparent" } : null,
+                    disableBodyScroll ? { overflow: "visible" } : null
                   ],
                   children
                 }
@@ -18771,9 +18799,9 @@ var ModalDialog = forwardRef16(
         withoutContentPadding: true,
         css: modalDialogInnerStyles,
         width: "",
-        children: /* @__PURE__ */ jsxs68(VerticalRhythm, { css: modalDialogWrapper, children: [
+        children: /* @__PURE__ */ jsxs68(VerticalRhythm, { css: modalDialogWrapper(Boolean(onRequestClose)), children: [
           /* @__PURE__ */ jsx103("div", { css: modalHeaderStyles, children: header2 }),
-          /* @__PURE__ */ jsx103("div", { children }),
+          /* @__PURE__ */ jsx103("div", { css: { flex: 1 }, children }),
           /* @__PURE__ */ jsx103(HorizontalRhythm, { children: buttonGroup })
         ] })
       }
@@ -19241,7 +19269,7 @@ var ObjectListItem2 = (props) => {
             /* @__PURE__ */ jsx111(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: header2 }),
             renderAs === "multi" ? props.children : null
           ] }),
-          /* @__PURE__ */ jsx111(HorizontalRhythm, { gap: "xs", align: "flex-start", children: rightSlot })
+          /* @__PURE__ */ jsx111(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: rightSlot })
         ] }),
         menuItems ? /* @__PURE__ */ jsx111(HorizontalRhythm, { gap: "0", align: "flex-start", children: /* @__PURE__ */ jsx111(
           Menu,
@@ -20151,7 +20179,7 @@ var ParameterImageInner = forwardRef19((props, ref) => {
         type: "text",
         id,
         ref,
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         autoComplete: "off",
         ...props
       }
@@ -20176,7 +20204,7 @@ var ParameterInputInner = forwardRef20(
         css: input3,
         id,
         type: props.type || "text",
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         autoComplete: "off",
         ref,
         ...props
@@ -20197,7 +20225,7 @@ var ParameterLink = forwardRef21(
         "data-testid": "link-parameter-editor",
         ...shellProps,
         label: innerProps.value ? shellProps.label : "",
-        title: !innerProps.value ? shellProps.label : void 0,
+        title: !innerProps.value && typeof shellProps.label === "string" ? shellProps.label : void 0,
         children: /* @__PURE__ */ jsx126(
           ParameterLinkInner,
           {
@@ -20225,7 +20253,7 @@ var ParameterLinkInner = forwardRef21(
           readOnly: Boolean(props.value),
           id,
           ref,
-          "aria-label": hiddenLabel ? label : void 0,
+          "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
           ...props
         }
       ),
@@ -20275,7 +20303,7 @@ var ParameterMultiSelectInner = (props) => {
       isMulti: true,
       isClearable: (_a = props.isClearable) != null ? _a : false,
       id,
-      "aria-label": label,
+      "aria-label": typeof label === "string" ? label : void 0,
       classNamePrefix: "parameter-multi-select-combobox",
       styles: {
         menuPortal: (base) => ({
@@ -23230,7 +23258,7 @@ var ParameterSelectInner = forwardRef23(
       {
         css: [input3, selectInput],
         id,
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         ref,
         ...props,
         children: [
@@ -23260,7 +23288,7 @@ var ParameterTextareaInner = forwardRef24(({ ...props }, ref) => {
       css: [input3, textarea2],
       id,
       ref,
-      "aria-label": hiddenLabel ? label : void 0,
+      "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
       ...props
     }
   );
@@ -24211,16 +24239,15 @@ var StatusBullet = ({
     Deleted: StatusDeleted
   };
   const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
-  return /* @__PURE__ */ jsx144(
+  return /* @__PURE__ */ jsx144(Tooltip, { title: message != null ? message : status, children: /* @__PURE__ */ jsx144(
     "span",
     {
       role: "status",
       css: [StatusBulletContainer, currentStateStyles[status], statusSize],
-      title: message != null ? message : status,
       ...props,
       children: hideText ? null : message ? message : status
     }
-  );
+  ) });
 };
 export {
   AddButton,

package/dist/index.d.mts

@@ -21109,6 +21109,11 @@ declare const allSupportedIcons: {
     yinyang: _react_icons_all_files.IconType;
     'zoom-in': _react_icons_all_files.IconType;
     'zoom-out': _react_icons_all_files.IconType;
+    'device-mobile': _react_icons_all_files.IconType;
+    'device-tablet': _react_icons_all_files.IconType;
+    'device-tv': _react_icons_all_files.IconType;
+    'device-ipad': _react_icons_all_files.IconType;
+    'device-mobile-rotated': _react_icons_all_files.IconType;
 };
 
 /** A list of available icon names that can be used with the Uniform brand */
@@ -21385,6 +21390,11 @@ type ChipProps = {
      * @default 'span'
      */
     as?: 'span' | 'button';
+    /**
+     * Whether the chip is visually disabled
+     * @default false
+     */
+    isDisabled?: boolean;
 } & React.HTMLAttributes<HTMLSpanElement>;
 /**
  * @description Chips are used in a variety of ways
@@ -21393,7 +21403,7 @@ type ChipProps = {
  * To represent a different object, as a reference
  * @example <Chip text="productId" theme="accent-light" chipAction={<DismissibleChipAction onDismiss={() => {...}}/>} />
  */
-declare const Chip: ({ icon, iconColor, text, size, theme, variant, chipAction, as, ...props }: ChipProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Chip: ({ icon, iconColor, text, size, theme, variant, chipAction, isDisabled, as, ...props }: ChipProps) => _emotion_react_jsx_runtime.JSX.Element;
 type DismissibleChipActionProps = {
     onDismiss: () => void;
 } & HTMLAttributes<HTMLButtonElement>;
@@ -21922,7 +21932,7 @@ declare const InfoMessage: ({ message, testId, icon, ...props }: InfoMessageProp
 
 type InputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
     /** (optional) sets the label value */
-    label?: string;
+    label?: string | React$1.ReactNode;
     /** (optional) sets caption text value */
     caption?: string | JSX.Element;
     /** (optional) add an input icon to the input field */
@@ -21965,7 +21975,7 @@ type InputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
  */
 declare const Input: React$1.ForwardRefExoticComponent<React$1.InputHTMLAttributes<HTMLInputElement> & {
     /** (optional) sets the label value */
-    label?: string;
+    label?: string | React$1.ReactNode;
     /** (optional) sets caption text value */
     caption?: string | JSX.Element;
     /** (optional) add an input icon to the input field */
@@ -22758,6 +22768,9 @@ declare function MenuItemIcon({ icon }: {
  */
 declare function MenuItemEmptyIcon(): _emotion_react_jsx_runtime.JSX.Element;
 
+/**
+ * @deprecated this is deprecated and will be removed in the next major release. Use MenuGroup instead.
+ */
 declare const MenuItemHeading: ({ children }: {
     children: ReactNode;
 }) => _emotion_react_jsx_runtime.JSX.Element;
@@ -22826,8 +22839,11 @@ declare const MediaCard: ({ title, subtitle, infoPopover, cover, menuItems, side
 type ModalProps = {
     header?: React__default.ReactNode;
     children?: React__default.ReactNode;
-    /** Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked  */
-    onRequestClose: () => void;
+    /**
+     * Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked.
+     * If undefined is passed, the modal will not be closable by the user and the close button will not be rendered.
+     */
+    onRequestClose: (() => void) | undefined;
     /** The size sets the modal width to one of three options sm = 400px, md = 600px and lg = 800px
      * if a width attribute is used the size will be overridden by the width attribute
      * @default 'lg'
@@ -22847,6 +22863,12 @@ type ModalProps = {
     withoutContentBackground?: boolean;
     /** Places buttons at the bottom of the modal */
     buttonGroup?: ReactNode;
+    /**
+     * Disables scrolling of the modal body if the content exceeds the height.
+     * Can be required for modals that have comboboxes where the menu items are expected
+     * to overflow the bounds of the modal.
+     */
+    disableBodyScroll?: boolean;
 } & React__default.HTMLProps<HTMLDialogElement>;
 /**
  * A modal component to open a dialog with a backdrop that covers the whole page.
@@ -22992,7 +23014,7 @@ declare function Pagination({ limit, offset, total, onPageChange, }: {
 
 type CommonParameterProps = {
     /** sets the label value */
-    label: string;
+    label: string | ReactNode;
     /** (optional): allows user to pass a component before the label */
     labelLeadingIcon?: ReactNode;
     /** (optional): allows user to pass a component after the label */
@@ -23047,7 +23069,7 @@ type CommonParameterSelectProps = {
 declare const ParameterShellContext: React$1.Context<CommonParameterProps>;
 declare const useParameterShell: () => {
     id: string;
-    label: string;
+    label: React$1.ReactNode;
     hiddenLabel: boolean | undefined;
     errorMessage: string | undefined;
     handleManuallySetErrorMessage: ((message: string | undefined) => void) | undefined;
@@ -23401,7 +23423,7 @@ declare const ParameterSelectInner: React$1.ForwardRefExoticComponent<Omit<Param
 declare const extractParameterProps: <T>(props: T & CommonParameterInputProps) => {
     shellProps: {
         id: string;
-        label: string;
+        label: ReactNode;
         caption: string | undefined;
         captionTestId: string | undefined;
         errorMessage: string | undefined;

package/dist/index.d.ts

@@ -21109,6 +21109,11 @@ declare const allSupportedIcons: {
     yinyang: _react_icons_all_files.IconType;
     'zoom-in': _react_icons_all_files.IconType;
     'zoom-out': _react_icons_all_files.IconType;
+    'device-mobile': _react_icons_all_files.IconType;
+    'device-tablet': _react_icons_all_files.IconType;
+    'device-tv': _react_icons_all_files.IconType;
+    'device-ipad': _react_icons_all_files.IconType;
+    'device-mobile-rotated': _react_icons_all_files.IconType;
 };
 
 /** A list of available icon names that can be used with the Uniform brand */
@@ -21385,6 +21390,11 @@ type ChipProps = {
      * @default 'span'
      */
     as?: 'span' | 'button';
+    /**
+     * Whether the chip is visually disabled
+     * @default false
+     */
+    isDisabled?: boolean;
 } & React.HTMLAttributes<HTMLSpanElement>;
 /**
  * @description Chips are used in a variety of ways
@@ -21393,7 +21403,7 @@ type ChipProps = {
  * To represent a different object, as a reference
  * @example <Chip text="productId" theme="accent-light" chipAction={<DismissibleChipAction onDismiss={() => {...}}/>} />
  */
-declare const Chip: ({ icon, iconColor, text, size, theme, variant, chipAction, as, ...props }: ChipProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Chip: ({ icon, iconColor, text, size, theme, variant, chipAction, isDisabled, as, ...props }: ChipProps) => _emotion_react_jsx_runtime.JSX.Element;
 type DismissibleChipActionProps = {
     onDismiss: () => void;
 } & HTMLAttributes<HTMLButtonElement>;
@@ -21922,7 +21932,7 @@ declare const InfoMessage: ({ message, testId, icon, ...props }: InfoMessageProp
 
 type InputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
     /** (optional) sets the label value */
-    label?: string;
+    label?: string | React$1.ReactNode;
     /** (optional) sets caption text value */
     caption?: string | JSX.Element;
     /** (optional) add an input icon to the input field */
@@ -21965,7 +21975,7 @@ type InputProps = React$1.InputHTMLAttributes<HTMLInputElement> & {
  */
 declare const Input: React$1.ForwardRefExoticComponent<React$1.InputHTMLAttributes<HTMLInputElement> & {
     /** (optional) sets the label value */
-    label?: string;
+    label?: string | React$1.ReactNode;
     /** (optional) sets caption text value */
     caption?: string | JSX.Element;
     /** (optional) add an input icon to the input field */
@@ -22758,6 +22768,9 @@ declare function MenuItemIcon({ icon }: {
  */
 declare function MenuItemEmptyIcon(): _emotion_react_jsx_runtime.JSX.Element;
 
+/**
+ * @deprecated this is deprecated and will be removed in the next major release. Use MenuGroup instead.
+ */
 declare const MenuItemHeading: ({ children }: {
     children: ReactNode;
 }) => _emotion_react_jsx_runtime.JSX.Element;
@@ -22826,8 +22839,11 @@ declare const MediaCard: ({ title, subtitle, infoPopover, cover, menuItems, side
 type ModalProps = {
     header?: React__default.ReactNode;
     children?: React__default.ReactNode;
-    /** Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked  */
-    onRequestClose: () => void;
+    /**
+     * Called when the close button is clicked, the Escape button is pressed, or when the modal's backdrop is clicked.
+     * If undefined is passed, the modal will not be closable by the user and the close button will not be rendered.
+     */
+    onRequestClose: (() => void) | undefined;
     /** The size sets the modal width to one of three options sm = 400px, md = 600px and lg = 800px
      * if a width attribute is used the size will be overridden by the width attribute
      * @default 'lg'
@@ -22847,6 +22863,12 @@ type ModalProps = {
     withoutContentBackground?: boolean;
     /** Places buttons at the bottom of the modal */
     buttonGroup?: ReactNode;
+    /**
+     * Disables scrolling of the modal body if the content exceeds the height.
+     * Can be required for modals that have comboboxes where the menu items are expected
+     * to overflow the bounds of the modal.
+     */
+    disableBodyScroll?: boolean;
 } & React__default.HTMLProps<HTMLDialogElement>;
 /**
  * A modal component to open a dialog with a backdrop that covers the whole page.
@@ -22992,7 +23014,7 @@ declare function Pagination({ limit, offset, total, onPageChange, }: {
 
 type CommonParameterProps = {
     /** sets the label value */
-    label: string;
+    label: string | ReactNode;
     /** (optional): allows user to pass a component before the label */
     labelLeadingIcon?: ReactNode;
     /** (optional): allows user to pass a component after the label */
@@ -23047,7 +23069,7 @@ type CommonParameterSelectProps = {
 declare const ParameterShellContext: React$1.Context<CommonParameterProps>;
 declare const useParameterShell: () => {
     id: string;
-    label: string;
+    label: React$1.ReactNode;
     hiddenLabel: boolean | undefined;
     errorMessage: string | undefined;
     handleManuallySetErrorMessage: ((message: string | undefined) => void) | undefined;
@@ -23401,7 +23423,7 @@ declare const ParameterSelectInner: React$1.ForwardRefExoticComponent<Omit<Param
 declare const extractParameterProps: <T>(props: T & CommonParameterInputProps) => {
     shellProps: {
         id: string;
-        label: string;
+        label: ReactNode;
         caption: string | undefined;
         captionTestId: string | undefined;
         errorMessage: string | undefined;

package/dist/index.js

@@ -45,7 +45,7 @@ var importedIcons_exports = {};
 __export(importedIcons_exports, {
   importedIcons: () => importedIcons
 });
-var import_CgAdd, import_CgAddR, import_CgAirplane, import_CgAlarm, import_CgAlbum, import_CgAlignBottom, import_CgAlignCenter, import_CgAlignLeft, import_CgAlignMiddle, import_CgAlignRight, import_CgAlignTop, import_CgAnchor, import_CgAppleWatch, import_CgArrangeBack, import_CgArrangeFront, import_CgArrowAlignH, import_CgArrowAlignV, import_CgArrowBottomLeft, import_CgArrowBottomLeftO, import_CgArrowBottomLeftR, import_CgArrowBottomRight, import_CgArrowBottomRightO, import_CgArrowBottomRightR, import_CgArrowDown, import_CgArrowDownO, import_CgArrowDownR, import_CgArrowLeft, import_CgArrowLeftO, import_CgArrowLeftR, import_CgArrowLongDown, import_CgArrowLongDownC, import_CgArrowLongDownE, import_CgArrowLongDownL, import_CgArrowLongDownR, import_CgArrowLongLeft, import_CgArrowLongLeftC, import_CgArrowLongLeftE, import_CgArrowLongLeftL, import_CgArrowLongLeftR, import_CgArrowLongRight, import_CgArrowLongRightC, import_CgArrowLongRightE, import_CgArrowLongRightL, import_CgArrowLongRightR, import_CgArrowLongUp, import_CgArrowLongUpC, import_CgArrowLongUpE, import_CgArrowLongUpL, import_CgArrowLongUpR, import_CgArrowRight, import_CgArrowRightO, import_CgArrowRightR, import_CgArrowsBreakeH, import_CgArrowsBreakeV, import_CgArrowsExchange, import_CgArrowsExchangeAlt, import_CgArrowsExchangeAltV, import_CgArrowsExchangeV, import_CgArrowsExpandDownLeft, import_CgArrowsExpandDownRight, import_CgArrowsExpandLeft, import_CgArrowsExpandLeftAlt, import_CgArrowsExpandRight, import_CgArrowsExpandRightAlt, import_CgArrowsExpandUpLeft, import_CgArrowsExpandUpRight, import_CgArrowsH, import_CgArrowsHAlt, import_CgArrowsMergeAltH, import_CgArrowsMergeAltV, import_CgArrowsScrollH, import_CgArrowsScrollV, import_CgArrowsShrinkH, import_CgArrowsShrinkV, import_CgArrowsV, import_CgArrowsVAlt, import_CgArrowTopLeft, import_CgArrowTopLeftO, import_CgArrowTopLeftR, import_CgArrowTopRight, import_CgArrowTopRightO, import_CgArrowTopRightR, import_CgArrowUp, import_CgArrowUpO, import_CgArrowUpR, import_CgAssign, import_CgAsterisk, import_CgAttachment, import_CgAttribution, import_CgAwards, import_CgBackspace, import_CgBandAid, import_CgBattery, import_CgBatteryEmpty, import_CgBatteryFull, import_CgBee, import_CgBell, import_CgBitbucket, import_CgBlock, import_CgBoard, import_CgBolt, import_CgBookmark, import_CgBorderAll, import_CgBorderBottom, import_CgBorderLeft, import_CgBorderRight, import_CgBorderStyleDashed, import_CgBorderStyleDotted, import_CgBorderStyleSolid, import_CgBot, import_CgBowl, import_CgBox, import_CgBoy, import_CgBriefcase, import_CgBrowse, import_CgBrowser, import_CgBrush, import_CgBulb, import_CgCalculator, import_CgCalendar, import_CgCalendarDates, import_CgCalendarDue, import_CgCalendarNext, import_CgCalendarToday, import_CgCalendarTwo, import_CgCalibrate, import_CgCamera, import_CgCap, import_CgCaptions, import_CgCardClubs, import_CgCardDiamonds, import_CgCardHearts, import_CgCardSpades, import_CgCarousel, import_CgCast, import_CgChart, import_CgCheck, import_CgCheckO, import_CgCheckR, import_CgChevronDoubleDown, import_CgChevronDoubleDownO, import_CgChevronDoubleDownR, import_CgChevronDoubleLeft, import_CgChevronDoubleLeftO, import_CgChevronDoubleLeftR, import_CgChevronDoubleRight, import_CgChevronDoubleRightO, import_CgChevronDoubleRightR, import_CgChevronDoubleUp, import_CgChevronDoubleUpO, import_CgChevronDoubleUpR, import_CgChevronDown, import_CgChevronDownO, import_CgChevronDownR, import_CgChevronLeft, import_CgChevronLeftO, import_CgChevronLeftR, import_CgChevronRight, import_CgChevronRightO, import_CgChevronRightR, import_CgChevronUp, import_CgChevronUpO, import_CgChevronUpR, import_CgClapperBoard, import_CgClipboard, import_CgClose, import_CgCloseO, import_CgCloseR, import_CgCloud, import_CgCode, import_CgCodeSlash, import_CgCoffee, import_CgCollage, import_CgColorBucket, import_CgColorPicker, import_CgComment, import_CgCommunity, import_CgComponents, import_CgCompress, import_CgCompressLeft, import_CgCompressRight, import_CgCompressV, import_CgController, import_CgCopy, import_CgCopyright, import_CgCornerDoubleDownLeft, import_CgCornerDoubleDownRight, import_CgCornerDoubleLeftDown, import_CgCornerDoubleLeftUp, import_CgCornerDoubleRightDown, import_CgCornerDoubleRightUp, import_CgCornerDoubleUpLeft, import_CgCornerDoubleUpRight, import_CgCornerDownLeft, import_CgCornerDownRight, import_CgCornerLeftDown, import_CgCornerLeftUp, import_CgCornerRightDown, import_CgCornerRightUp, import_CgCornerUpLeft, import_CgCornerUpRight, import_CgCPlusPlus, import_CgCreditCard, import_CgCrop, import_CgCross, import_CgCrown, import_CgDanger, import_CgDarkMode, import_CgData, import_CgDatabase, import_CgDebug, import_CgDesktop, import_CgDetailsLess, import_CgDetailsMore, import_CgDialpad, import_CgDice1, import_CgDice2, import_CgDice3, import_CgDice4, import_CgDice5, import_CgDice6, import_CgDisc, import_CgDisplayFlex, import_CgDisplayFullwidth, import_CgDisplayGrid, import_CgDisplaySpacing, import_CgDistributeHorizontal, import_CgDistributeVertical, import_CgDockBottom, import_CgDockLeft, import_CgDockRight, import_CgDockWindow, import_CgDollar, import_CgDrive, import_CgDrop, import_CgDropInvert, import_CgDropOpacity, import_CgDuplicate, import_CgEditBlackPoint, import_CgEditContrast, import_CgEditExposure, import_CgEditFade, import_CgEditFlipH, import_CgEditFlipV, import_CgEditHighlight, import_CgEditMarkup, import_CgEditMask, import_CgEditNoise, import_CgEditShadows, import_CgEditStraight, import_CgEditUnmask, import_CgEject, import_CgEnter, import_CgErase, import_CgEreader, import_CgEricsson, import_CgEthernet, import_CgEuro, import_CgExpand, import_CgExport, import_CgExtension, import_CgExtensionAdd, import_CgExtensionAlt, import_CgExtensionRemove, import_CgExternal, import_CgEye, import_CgEyeAlt, import_CgFeed, import_CgFile, import_CgFileAdd, import_CgFileDocument, import_CgFileRemove, import_CgFilm, import_CgFilters, import_CgFlag, import_CgFlagAlt, import_CgFolder, import_CgFolderAdd, import_CgFolderRemove, import_CgFontHeight, import_CgFontSpacing, import_CgFormatBold, import_CgFormatCenter, import_CgFormatColor, import_CgFormatHeading, import_CgFormatIndentDecrease, import_CgFormatIndentIncrease, import_CgFormatItalic, import_CgFormatJustify, import_CgFormatLeft, import_CgFormatLineHeight, import_CgFormatRight, import_CgFormatSeparator, import_CgFormatSlash, import_CgFormatStrike, import_CgFormatText, import_CgFormatUnderline, import_CgFormatUppercase, import_CgGames, import_CgGenderFemale, import_CgGenderMale, import_CgGhostCharacter, import_CgGift, import_CgGirl, import_CgGitBranch, import_CgGitCommit, import_CgGitFork, import_CgGitPull, import_CgGlass, import_CgGlassAlt, import_CgGlobe, import_CgGlobeAlt, import_CgGym, import_CgHashtag, import_CgHeadset, import_CgHeart, import_CgHome, import_CgHomeAlt, import_CgHomeScreen, import_CgIcecream, import_CgImage, import_CgImport, import_CgInbox, import_CgInfinity, import_CgInfo, import_CgInpicture, import_CgInsertAfter, import_CgInsertAfterO, import_CgInsertAfterR, import_CgInsertBefore, import_CgInsertBeforeO, import_CgInsertBeforeR, import_CgInsights, import_CgInternal, import_CgKey, import_CgKeyboard, import_CgKeyhole, import_CgLaptop, import_CgLayoutGrid, import_CgLayoutGridSmall, import_CgLayoutList, import_CgLayoutPin, import_CgLink, import_CgList, import_CgListTree, import_CgLivePhoto, import_CgLoadbar, import_CgLoadbarAlt, import_CgLoadbarDoc, import_CgLoadbarSound, import_CgLock, import_CgLockUnlock, import_CgLogIn, import_CgLogOff, import_CgLogOut, import_CgLoupe, import_CgMagnet, import_CgMail, import_CgMailForward, import_CgMailOpen, import_CgMailReply, import_CgMathDivide, import_CgMathEqual, import_CgMathMinus, import_CgMathPercent, import_CgMathPlus, import_CgMaximize, import_CgMaximizeAlt, import_CgMediaLive, import_CgMediaPodcast, import_CgMenu, import_CgMenuBoxed, import_CgMenuCake, import_CgMenuCheese, import_CgMenuGridO, import_CgMenuGridR, import_CgMenuHotdog, import_CgMenuLeft, import_CgMenuLeftAlt, import_CgMenuMotion, import_CgMenuOreos, import_CgMenuRight, import_CgMenuRightAlt, import_CgMenuRound, import_CgMergeHorizontal, import_CgMergeVertical, import_CgMic, import_CgMinimize, import_CgMinimizeAlt, import_CgMiniPlayer, import_CgModem, import_CgMoon, import_CgMore, import_CgMoreAlt, import_CgMoreO, import_CgMoreR, import_CgMoreVertical, import_CgMoreVerticalAlt, import_CgMoreVerticalO, import_CgMoreVerticalR, import_CgMouse, import_CgMoveDown, import_CgMoveLeft, import_CgMoveRight, import_CgMoveTask, import_CgMoveUp, import_CgMusic, import_CgMusicNote, import_CgMusicSpeaker, import_CgNametag, import_CgNotes, import_CgNotifications, import_CgOptions, import_CgOrganisation, import_CgPassword, import_CgPathBack, import_CgPathCrop, import_CgPathDivide, import_CgPathExclude, import_CgPathFront, import_CgPathIntersect, import_CgPathOutline, import_CgPathTrim, import_CgPathUnite, import_CgPen, import_CgPentagonBottomLeft, import_CgPentagonBottomRight, import_CgPentagonDown, import_CgPentagonLeft, import_CgPentagonRight, import_CgPentagonTopLeft, import_CgPentagonTopRight, import_CgPentagonUp, import_CgPerformance, import_CgPhone, import_CgPhotoscan, import_CgPiano, import_CgPill, import_CgPin, import_CgPinAlt, import_CgPinBottom, import_CgPinTop, import_CgPlayBackwards, import_CgPlayButton, import_CgPlayButtonO, import_CgPlayButtonR, import_CgPlayForwards, import_CgPlayList, import_CgPlayListAdd, import_CgPlayListCheck, import_CgPlayListRemove, import_CgPlayListSearch, import_CgPlayPause, import_CgPlayPauseO, import_CgPlayPauseR, import_CgPlayStop, import_CgPlayStopO, import_CgPlayStopR, import_CgPlayTrackNext, import_CgPlayTrackNextO, import_CgPlayTrackNextR, import_CgPlayTrackPrev, import_CgPlayTrackPrevO, import_CgPlayTrackPrevR, import_CgPlug, import_CgPolaroid, import_CgPoll, import_CgPresentation, import_CgPrinter, import_CgProfile, import_CgPullClear, import_CgPushChevronDown, import_CgPushChevronDownO, import_CgPushChevronDownR, import_CgPushChevronLeft, import_CgPushChevronLeftO, import_CgPushChevronLeftR, import_CgPushChevronRight, import_CgPushChevronRightO, import_CgPushChevronRightR, import_CgPushChevronUp, import_CgPushChevronUpO, import_CgPushChevronUpR, import_CgPushDown, import_CgPushLeft, import_CgPushRight, import_CgPushUp, import_CgQr, import_CgQuote, import_CgQuoteO, import_CgRadioCheck, import_CgRadioChecked, import_CgRatio, import_CgRead, import_CgReadme, import_CgRecord, import_CgRedo, import_CgRemote, import_CgRemove, import_CgRemoveR, import_CgRename, import_CgReorder, import_CgRepeat, import_CgRing, import_CgRowFirst, import_CgRowLast, import_CgRuler, import_CgSandClock, import_CgScan, import_CgScreen, import_CgScreenMirror, import_CgScreenShot, import_CgScreenWide, import_CgScrollH, import_CgScrollV, import_CgSearch, import_CgSearchFound, import_CgSearchLoading, import_CgSelect, import_CgSelectO, import_CgSelectR, import_CgServer, import_CgShapeCircle, import_CgShapeHalfCircle, import_CgShapeHexagon, import_CgShapeRhombus, import_CgShapeSquare, import_CgShapeTriangle, import_CgShapeZigzag, import_CgShare, import_CgShield, import_CgShoppingBag, import_CgShoppingCart, import_CgShortcut, import_CgSidebar, import_CgSidebarOpen, import_CgSidebarRight, import_CgSignal, import_CgSize, import_CgSleep, import_CgSmartHomeBoiler, import_CgSmartHomeCooker, import_CgSmartHomeHeat, import_CgSmartHomeLight, import_CgSmartHomeRefrigerator, import_CgSmartHomeWashMachine, import_CgSmartphone, import_CgSmartphoneChip, import_CgSmartphoneRam, import_CgSmartphoneShake, import_CgSmile, import_CgSmileMouthOpen, import_CgSmileNeutral, import_CgSmileNoMouth, import_CgSmileNone, import_CgSmileSad, import_CgSmileUpside, import_CgSoftwareDownload, import_CgSoftwareUpload, import_CgSortAz, import_CgSortZa, import_CgSpaceBetween, import_CgSpaceBetweenV, import_CgSpinner, import_CgSpinnerAlt, import_CgSpinnerTwo, import_CgSpinnerTwoAlt, import_CgStack, import_CgStopwatch, import_CgStories, import_CgStyle, import_CgSun, import_CgSupport, import_CgSwap, import_CgSwapVertical, import_CgSweden, import_CgSwiss, import_CgSync, import_CgTab, import_CgTag, import_CgTapDouble, import_CgTapSingle, import_CgTemplate, import_CgTennis, import_CgTerminal, import_CgTerrain, import_CgThermometer, import_CgThermostat, import_CgTikcode, import_CgTime, import_CgTimelapse, import_CgTimer, import_CgToday, import_CgToggleOff, import_CgToggleOn, import_CgToggleSquare, import_CgToggleSquareOff, import_CgToolbarBottom, import_CgToolbarLeft, import_CgToolbarRight, import_CgToolbarTop, import_CgToolbox, import_CgTouchpad, import_CgTrack, import_CgTranscript, import_CgTrash, import_CgTrashEmpty, import_CgTree, import_CgTrees, import_CgTrending, import_CgTrendingDown, import_CgTrophy, import_CgTv, import_CgUiKit, import_CgUmbrella, import_CgUnavailable, import_CgUnblock, import_CgUndo, import_CgUnsplash, import_CgUsb, import_CgUsbC, import_CgUser, import_CgUserAdd, import_CgUserList, import_CgUserRemove, import_CgViewCols, import_CgViewComfortable, import_CgViewDay, import_CgViewGrid, import_CgViewList, import_CgViewMonth, import_CgViewSplit, import_CgVinyl, import_CgVoicemail, import_CgVoicemailO, import_CgVoicemailR, import_CgVolume, import_CgWebcam, import_CgWebsite, import_CgWorkAlt, import_CgYinyang, import_CgZoomIn, import_CgZoomOut, import_MdCopyAll, importedIcons;
+var import_CgAdd, import_CgAddR, import_CgAirplane, import_CgAlarm, import_CgAlbum, import_CgAlignBottom, import_CgAlignCenter, import_CgAlignLeft, import_CgAlignMiddle, import_CgAlignRight, import_CgAlignTop, import_CgAnchor, import_CgAppleWatch, import_CgArrangeBack, import_CgArrangeFront, import_CgArrowAlignH, import_CgArrowAlignV, import_CgArrowBottomLeft, import_CgArrowBottomLeftO, import_CgArrowBottomLeftR, import_CgArrowBottomRight, import_CgArrowBottomRightO, import_CgArrowBottomRightR, import_CgArrowDown, import_CgArrowDownO, import_CgArrowDownR, import_CgArrowLeft, import_CgArrowLeftO, import_CgArrowLeftR, import_CgArrowLongDown, import_CgArrowLongDownC, import_CgArrowLongDownE, import_CgArrowLongDownL, import_CgArrowLongDownR, import_CgArrowLongLeft, import_CgArrowLongLeftC, import_CgArrowLongLeftE, import_CgArrowLongLeftL, import_CgArrowLongLeftR, import_CgArrowLongRight, import_CgArrowLongRightC, import_CgArrowLongRightE, import_CgArrowLongRightL, import_CgArrowLongRightR, import_CgArrowLongUp, import_CgArrowLongUpC, import_CgArrowLongUpE, import_CgArrowLongUpL, import_CgArrowLongUpR, import_CgArrowRight, import_CgArrowRightO, import_CgArrowRightR, import_CgArrowsBreakeH, import_CgArrowsBreakeV, import_CgArrowsExchange, import_CgArrowsExchangeAlt, import_CgArrowsExchangeAltV, import_CgArrowsExchangeV, import_CgArrowsExpandDownLeft, import_CgArrowsExpandDownRight, import_CgArrowsExpandLeft, import_CgArrowsExpandLeftAlt, import_CgArrowsExpandRight, import_CgArrowsExpandRightAlt, import_CgArrowsExpandUpLeft, import_CgArrowsExpandUpRight, import_CgArrowsH, import_CgArrowsHAlt, import_CgArrowsMergeAltH, import_CgArrowsMergeAltV, import_CgArrowsScrollH, import_CgArrowsScrollV, import_CgArrowsShrinkH, import_CgArrowsShrinkV, import_CgArrowsV, import_CgArrowsVAlt, import_CgArrowTopLeft, import_CgArrowTopLeftO, import_CgArrowTopLeftR, import_CgArrowTopRight, import_CgArrowTopRightO, import_CgArrowTopRightR, import_CgArrowUp, import_CgArrowUpO, import_CgArrowUpR, import_CgAssign, import_CgAsterisk, import_CgAttachment, import_CgAttribution, import_CgAwards, import_CgBackspace, import_CgBandAid, import_CgBattery, import_CgBatteryEmpty, import_CgBatteryFull, import_CgBee, import_CgBell, import_CgBitbucket, import_CgBlock, import_CgBoard, import_CgBolt, import_CgBookmark, import_CgBorderAll, import_CgBorderBottom, import_CgBorderLeft, import_CgBorderRight, import_CgBorderStyleDashed, import_CgBorderStyleDotted, import_CgBorderStyleSolid, import_CgBot, import_CgBowl, import_CgBox, import_CgBoy, import_CgBriefcase, import_CgBrowse, import_CgBrowser, import_CgBrush, import_CgBulb, import_CgCalculator, import_CgCalendar, import_CgCalendarDates, import_CgCalendarDue, import_CgCalendarNext, import_CgCalendarToday, import_CgCalendarTwo, import_CgCalibrate, import_CgCamera, import_CgCap, import_CgCaptions, import_CgCardClubs, import_CgCardDiamonds, import_CgCardHearts, import_CgCardSpades, import_CgCarousel, import_CgCast, import_CgChart, import_CgCheck, import_CgCheckO, import_CgCheckR, import_CgChevronDoubleDown, import_CgChevronDoubleDownO, import_CgChevronDoubleDownR, import_CgChevronDoubleLeft, import_CgChevronDoubleLeftO, import_CgChevronDoubleLeftR, import_CgChevronDoubleRight, import_CgChevronDoubleRightO, import_CgChevronDoubleRightR, import_CgChevronDoubleUp, import_CgChevronDoubleUpO, import_CgChevronDoubleUpR, import_CgChevronDown, import_CgChevronDownO, import_CgChevronDownR, import_CgChevronLeft, import_CgChevronLeftO, import_CgChevronLeftR, import_CgChevronRight, import_CgChevronRightO, import_CgChevronRightR, import_CgChevronUp, import_CgChevronUpO, import_CgChevronUpR, import_CgClapperBoard, import_CgClipboard, import_CgClose, import_CgCloseO, import_CgCloseR, import_CgCloud, import_CgCode, import_CgCodeSlash, import_CgCoffee, import_CgCollage, import_CgColorBucket, import_CgColorPicker, import_CgComment, import_CgCommunity, import_CgComponents, import_CgCompress, import_CgCompressLeft, import_CgCompressRight, import_CgCompressV, import_CgController, import_CgCopy, import_CgCopyright, import_CgCornerDoubleDownLeft, import_CgCornerDoubleDownRight, import_CgCornerDoubleLeftDown, import_CgCornerDoubleLeftUp, import_CgCornerDoubleRightDown, import_CgCornerDoubleRightUp, import_CgCornerDoubleUpLeft, import_CgCornerDoubleUpRight, import_CgCornerDownLeft, import_CgCornerDownRight, import_CgCornerLeftDown, import_CgCornerLeftUp, import_CgCornerRightDown, import_CgCornerRightUp, import_CgCornerUpLeft, import_CgCornerUpRight, import_CgCPlusPlus, import_CgCreditCard, import_CgCrop, import_CgCross, import_CgCrown, import_CgDanger, import_CgDarkMode, import_CgData, import_CgDatabase, import_CgDebug, import_CgDesktop, import_CgDetailsLess, import_CgDetailsMore, import_CgDialpad, import_CgDice1, import_CgDice2, import_CgDice3, import_CgDice4, import_CgDice5, import_CgDice6, import_CgDisc, import_CgDisplayFlex, import_CgDisplayFullwidth, import_CgDisplayGrid, import_CgDisplaySpacing, import_CgDistributeHorizontal, import_CgDistributeVertical, import_CgDockBottom, import_CgDockLeft, import_CgDockRight, import_CgDockWindow, import_CgDollar, import_CgDrive, import_CgDrop, import_CgDropInvert, import_CgDropOpacity, import_CgDuplicate, import_CgEditBlackPoint, import_CgEditContrast, import_CgEditExposure, import_CgEditFade, import_CgEditFlipH, import_CgEditFlipV, import_CgEditHighlight, import_CgEditMarkup, import_CgEditMask, import_CgEditNoise, import_CgEditShadows, import_CgEditStraight, import_CgEditUnmask, import_CgEject, import_CgEnter, import_CgErase, import_CgEreader, import_CgEricsson, import_CgEthernet, import_CgEuro, import_CgExpand, import_CgExport, import_CgExtension, import_CgExtensionAdd, import_CgExtensionAlt, import_CgExtensionRemove, import_CgExternal, import_CgEye, import_CgEyeAlt, import_CgFeed, import_CgFile, import_CgFileAdd, import_CgFileDocument, import_CgFileRemove, import_CgFilm, import_CgFilters, import_CgFlag, import_CgFlagAlt, import_CgFolder, import_CgFolderAdd, import_CgFolderRemove, import_CgFontHeight, import_CgFontSpacing, import_CgFormatBold, import_CgFormatCenter, import_CgFormatColor, import_CgFormatHeading, import_CgFormatIndentDecrease, import_CgFormatIndentIncrease, import_CgFormatItalic, import_CgFormatJustify, import_CgFormatLeft, import_CgFormatLineHeight, import_CgFormatRight, import_CgFormatSeparator, import_CgFormatSlash, import_CgFormatStrike, import_CgFormatText, import_CgFormatUnderline, import_CgFormatUppercase, import_CgGames, import_CgGenderFemale, import_CgGenderMale, import_CgGhostCharacter, import_CgGift, import_CgGirl, import_CgGitBranch, import_CgGitCommit, import_CgGitFork, import_CgGitPull, import_CgGlass, import_CgGlassAlt, import_CgGlobe, import_CgGlobeAlt, import_CgGym, import_CgHashtag, import_CgHeadset, import_CgHeart, import_CgHome, import_CgHomeAlt, import_CgHomeScreen, import_CgIcecream, import_CgImage, import_CgImport, import_CgInbox, import_CgInfinity, import_CgInfo, import_CgInpicture, import_CgInsertAfter, import_CgInsertAfterO, import_CgInsertAfterR, import_CgInsertBefore, import_CgInsertBeforeO, import_CgInsertBeforeR, import_CgInsights, import_CgInternal, import_CgKey, import_CgKeyboard, import_CgKeyhole, import_CgLaptop, import_CgLayoutGrid, import_CgLayoutGridSmall, import_CgLayoutList, import_CgLayoutPin, import_CgLink, import_CgList, import_CgListTree, import_CgLivePhoto, import_CgLoadbar, import_CgLoadbarAlt, import_CgLoadbarDoc, import_CgLoadbarSound, import_CgLock, import_CgLockUnlock, import_CgLogIn, import_CgLogOff, import_CgLogOut, import_CgLoupe, import_CgMagnet, import_CgMail, import_CgMailForward, import_CgMailOpen, import_CgMailReply, import_CgMathDivide, import_CgMathEqual, import_CgMathMinus, import_CgMathPercent, import_CgMathPlus, import_CgMaximize, import_CgMaximizeAlt, import_CgMediaLive, import_CgMediaPodcast, import_CgMenu, import_CgMenuBoxed, import_CgMenuCake, import_CgMenuCheese, import_CgMenuGridO, import_CgMenuGridR, import_CgMenuHotdog, import_CgMenuLeft, import_CgMenuLeftAlt, import_CgMenuMotion, import_CgMenuOreos, import_CgMenuRight, import_CgMenuRightAlt, import_CgMenuRound, import_CgMergeHorizontal, import_CgMergeVertical, import_CgMic, import_CgMinimize, import_CgMinimizeAlt, import_CgMiniPlayer, import_CgModem, import_CgMoon, import_CgMore, import_CgMoreAlt, import_CgMoreO, import_CgMoreR, import_CgMoreVertical, import_CgMoreVerticalAlt, import_CgMoreVerticalO, import_CgMoreVerticalR, import_CgMouse, import_CgMoveDown, import_CgMoveLeft, import_CgMoveRight, import_CgMoveTask, import_CgMoveUp, import_CgMusic, import_CgMusicNote, import_CgMusicSpeaker, import_CgNametag, import_CgNotes, import_CgNotifications, import_CgOptions, import_CgOrganisation, import_CgPassword, import_CgPathBack, import_CgPathCrop, import_CgPathDivide, import_CgPathExclude, import_CgPathFront, import_CgPathIntersect, import_CgPathOutline, import_CgPathTrim, import_CgPathUnite, import_CgPen, import_CgPentagonBottomLeft, import_CgPentagonBottomRight, import_CgPentagonDown, import_CgPentagonLeft, import_CgPentagonRight, import_CgPentagonTopLeft, import_CgPentagonTopRight, import_CgPentagonUp, import_CgPerformance, import_CgPhone, import_CgPhotoscan, import_CgPiano, import_CgPill, import_CgPin, import_CgPinAlt, import_CgPinBottom, import_CgPinTop, import_CgPlayBackwards, import_CgPlayButton, import_CgPlayButtonO, import_CgPlayButtonR, import_CgPlayForwards, import_CgPlayList, import_CgPlayListAdd, import_CgPlayListCheck, import_CgPlayListRemove, import_CgPlayListSearch, import_CgPlayPause, import_CgPlayPauseO, import_CgPlayPauseR, import_CgPlayStop, import_CgPlayStopO, import_CgPlayStopR, import_CgPlayTrackNext, import_CgPlayTrackNextO, import_CgPlayTrackNextR, import_CgPlayTrackPrev, import_CgPlayTrackPrevO, import_CgPlayTrackPrevR, import_CgPlug, import_CgPolaroid, import_CgPoll, import_CgPresentation, import_CgPrinter, import_CgProfile, import_CgPullClear, import_CgPushChevronDown, import_CgPushChevronDownO, import_CgPushChevronDownR, import_CgPushChevronLeft, import_CgPushChevronLeftO, import_CgPushChevronLeftR, import_CgPushChevronRight, import_CgPushChevronRightO, import_CgPushChevronRightR, import_CgPushChevronUp, import_CgPushChevronUpO, import_CgPushChevronUpR, import_CgPushDown, import_CgPushLeft, import_CgPushRight, import_CgPushUp, import_CgQr, import_CgQuote, import_CgQuoteO, import_CgRadioCheck, import_CgRadioChecked, import_CgRatio, import_CgRead, import_CgReadme, import_CgRecord, import_CgRedo, import_CgRemote, import_CgRemove, import_CgRemoveR, import_CgRename, import_CgReorder, import_CgRepeat, import_CgRing, import_CgRowFirst, import_CgRowLast, import_CgRuler, import_CgSandClock, import_CgScan, import_CgScreen, import_CgScreenMirror, import_CgScreenShot, import_CgScreenWide, import_CgScrollH, import_CgScrollV, import_CgSearch, import_CgSearchFound, import_CgSearchLoading, import_CgSelect, import_CgSelectO, import_CgSelectR, import_CgServer, import_CgShapeCircle, import_CgShapeHalfCircle, import_CgShapeHexagon, import_CgShapeRhombus, import_CgShapeSquare, import_CgShapeTriangle, import_CgShapeZigzag, import_CgShare, import_CgShield, import_CgShoppingBag, import_CgShoppingCart, import_CgShortcut, import_CgSidebar, import_CgSidebarOpen, import_CgSidebarRight, import_CgSignal, import_CgSize, import_CgSleep, import_CgSmartHomeBoiler, import_CgSmartHomeCooker, import_CgSmartHomeHeat, import_CgSmartHomeLight, import_CgSmartHomeRefrigerator, import_CgSmartHomeWashMachine, import_CgSmartphone, import_CgSmartphoneChip, import_CgSmartphoneRam, import_CgSmartphoneShake, import_CgSmile, import_CgSmileMouthOpen, import_CgSmileNeutral, import_CgSmileNoMouth, import_CgSmileNone, import_CgSmileSad, import_CgSmileUpside, import_CgSoftwareDownload, import_CgSoftwareUpload, import_CgSortAz, import_CgSortZa, import_CgSpaceBetween, import_CgSpaceBetweenV, import_CgSpinner, import_CgSpinnerAlt, import_CgSpinnerTwo, import_CgSpinnerTwoAlt, import_CgStack, import_CgStopwatch, import_CgStories, import_CgStyle, import_CgSun, import_CgSupport, import_CgSwap, import_CgSwapVertical, import_CgSweden, import_CgSwiss, import_CgSync, import_CgTab, import_CgTag, import_CgTapDouble, import_CgTapSingle, import_CgTemplate, import_CgTennis, import_CgTerminal, import_CgTerrain, import_CgThermometer, import_CgThermostat, import_CgTikcode, import_CgTime, import_CgTimelapse, import_CgTimer, import_CgToday, import_CgToggleOff, import_CgToggleOn, import_CgToggleSquare, import_CgToggleSquareOff, import_CgToolbarBottom, import_CgToolbarLeft, import_CgToolbarRight, import_CgToolbarTop, import_CgToolbox, import_CgTouchpad, import_CgTrack, import_CgTranscript, import_CgTrash, import_CgTrashEmpty, import_CgTree, import_CgTrees, import_CgTrending, import_CgTrendingDown, import_CgTrophy, import_CgTv, import_CgUiKit, import_CgUmbrella, import_CgUnavailable, import_CgUnblock, import_CgUndo, import_CgUnsplash, import_CgUsb, import_CgUsbC, import_CgUser, import_CgUserAdd, import_CgUserList, import_CgUserRemove, import_CgViewCols, import_CgViewComfortable, import_CgViewDay, import_CgViewGrid, import_CgViewList, import_CgViewMonth, import_CgViewSplit, import_CgVinyl, import_CgVoicemail, import_CgVoicemailO, import_CgVoicemailR, import_CgVolume, import_CgWebcam, import_CgWebsite, import_CgWorkAlt, import_CgYinyang, import_CgZoomIn, import_CgZoomOut, import_MdCopyAll, import_TbDeviceIpad, import_TbDeviceMobile, import_TbDeviceMobileRotated, import_TbDeviceTablet, import_TbDeviceTv, importedIcons;
 var init_importedIcons = __esm({
   "src/components/Icons/importedIcons.ts"() {
     "use strict";
@@ -694,6 +694,11 @@ var init_importedIcons = __esm({
     import_CgZoomIn = require("@react-icons/all-files/cg/CgZoomIn");
     import_CgZoomOut = require("@react-icons/all-files/cg/CgZoomOut");
     import_MdCopyAll = require("@react-icons/all-files/md/MdCopyAll");
+    import_TbDeviceIpad = require("@react-icons/all-files/tb/TbDeviceIpad");
+    import_TbDeviceMobile = require("@react-icons/all-files/tb/TbDeviceMobile");
+    import_TbDeviceMobileRotated = require("@react-icons/all-files/tb/TbDeviceMobileRotated");
+    import_TbDeviceTablet = require("@react-icons/all-files/tb/TbDeviceTablet");
+    import_TbDeviceTv = require("@react-icons/all-files/tb/TbDeviceTv");
     importedIcons = {
       "add-r": import_CgAddR.CgAddR,
       add: import_CgAdd.CgAdd,
@@ -1338,7 +1343,12 @@ var init_importedIcons = __esm({
       "work-alt": import_CgWorkAlt.CgWorkAlt,
       yinyang: import_CgYinyang.CgYinyang,
       "zoom-in": import_CgZoomIn.CgZoomIn,
-      "zoom-out": import_CgZoomOut.CgZoomOut
+      "zoom-out": import_CgZoomOut.CgZoomOut,
+      "device-mobile": import_TbDeviceMobile.TbDeviceMobile,
+      "device-tablet": import_TbDeviceTablet.TbDeviceTablet,
+      "device-tv": import_TbDeviceTv.TbDeviceTv,
+      "device-ipad": import_TbDeviceIpad.TbDeviceIpad,
+      "device-mobile-rotated": import_TbDeviceMobileRotated.TbDeviceMobileRotated
     };
   }
 });
@@ -14764,7 +14774,7 @@ var Input = React10.forwardRef(
                       errorMessage ? inputError : void 0,
                       icon ? inputWithIcon : ""
                     ],
-                    "aria-label": !showLabel ? label : void 0,
+                    "aria-label": showLabel || typeof label !== "string" ? void 0 : label,
                     className: typeof classNameControl === "string" ? classNameControl : "",
                     ...props,
                     ref
@@ -15670,7 +15680,7 @@ var import_react58 = require("@emotion/react");
 var buttonSizeBase = import_react58.css`
   --icon-padding: var(--spacing-xs);
   --svg-size: 1rem;
-  --line-offset: -5px;
+  --line-offset: -1px;
   font-size: var(--fs-sm);
 
   button {
@@ -16917,6 +16927,9 @@ var ChipOutlined = import_react70.css`
     border-color: var(--outline-color);
   }
 `;
+var ChipDisabled = import_react70.css`
+  opacity: var(--opacity-50);
+`;
 
 // src/components/Chip/Chip.tsx
 var import_jsx_runtime62 = require("@emotion/react/jsx-runtime");
@@ -16936,6 +16949,7 @@ var Chip = ({
   theme = "accent-light",
   variant = "solid",
   chipAction,
+  isDisabled = false,
   as = "span",
   ...props
 }) => {
@@ -16952,7 +16966,8 @@ var Chip = ({
         ChipContainer,
         chipSize[size],
         chipTheme[theme],
-        variant === "outlined" ? ChipOutlined : void 0
+        variant === "outlined" ? ChipOutlined : void 0,
+        isDisabled ? ChipDisabled : void 0
       ],
       ...props,
       children: [
@@ -20489,8 +20504,9 @@ var modalContentStyles = import_react118.css`
   border-radius: var(--rounded-sm);
   ${scrollbarStyles}
 `;
-var modalDialogWrapper = import_react118.css`
-  padding: 0 var(--spacing-lg) var(--spacing-md);
+var modalDialogWrapper = (hasCloseButton) => import_react118.css`
+  height: 100%;
+  padding: ${hasCloseButton ? 0 : "var(--spacing-md)"} var(--spacing-lg) var(--spacing-md);
 `;
 var modalDialogInnerStyles = import_react118.css`
   // we need to override the gap of the modalInnerStyles when using a modal dialog
@@ -20514,8 +20530,10 @@ var Modal = import_react120.default.forwardRef(
     modalSize = "lg",
     withoutContentPadding = false,
     withoutContentBackground = false,
+    disableBodyScroll = false,
     ...modalProps
   }, ref) => {
+    const mouseDownInsideModal = (0, import_react120.useRef)(false);
     const dialogRef = (0, import_react120.useRef)(null);
     const size = {
       sm: modalSizeSmall,
@@ -20524,7 +20542,7 @@ var Modal = import_react120.default.forwardRef(
     };
     useShortcut({
       handler: () => {
-        onRequestClose();
+        onRequestClose == null ? void 0 : onRequestClose();
       },
       shortcut: "escape"
     });
@@ -20557,9 +20575,25 @@ var Modal = import_react120.default.forwardRef(
           }
         },
         css: [modalStyles, !width ? size[modalSize] : void 0],
-        style: { width, height: height === "auto" ? "min-content" : height },
+        style: {
+          width,
+          height: height === "auto" ? "min-content" : height,
+          // allows menus rendered in the PortalContext to overflow the modal contents
+          // (internal scrolling of contents is handled on a child element)
+          overflow: "visible"
+        },
         "data-testid": "side-dialog",
-        onClick: onRequestClose,
+        onClick: () => {
+          if (mouseDownInsideModal.current) {
+            return;
+          }
+          onRequestClose == null ? void 0 : onRequestClose();
+        },
+        onMouseUp: () => {
+          setTimeout(() => {
+            mouseDownInsideModal.current = false;
+          });
+        },
         onCancel: (e) => {
           e.preventDefault();
         },
@@ -20569,10 +20603,13 @@ var Modal = import_react120.default.forwardRef(
           {
             css: [modalInnerStyles, { height: height === "auto" ? "auto" : "100%" }],
             onClick: (e) => e.stopPropagation(),
+            onMouseDown: () => {
+              mouseDownInsideModal.current = true;
+            },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { css: modalHeaderStyles, children: [
-                !header2 ? null : /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { css: modalHeaderHeaderStyles, children: header2 }),
-                /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
+              header2 || onRequestClose ? /* @__PURE__ */ (0, import_jsx_runtime102.jsxs)("div", { css: modalHeaderStyles, children: [
+                header2 ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)("div", { css: modalHeaderHeaderStyles, children: header2 }) : null,
+                onRequestClose ? /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                   Button,
                   {
                     type: "button",
@@ -20583,15 +20620,16 @@ var Modal = import_react120.default.forwardRef(
                     "data-testid": "close-dialog",
                     children: /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(Icon, { icon: import_CgClose5.CgClose, iconColor: "currentColor", size: 24 })
                   }
-                )
-              ] }),
+                ) : null
+              ] }) : null,
               /* @__PURE__ */ (0, import_jsx_runtime102.jsx)(
                 "div",
                 {
                   css: [
                     modalContentStyles,
-                    !withoutContentPadding ? null : { padding: 0 },
-                    !withoutContentBackground ? null : { background: "transparent" }
+                    withoutContentPadding ? { padding: 0 } : null,
+                    withoutContentBackground ? { background: "transparent" } : null,
+                    disableBodyScroll ? { overflow: "visible" } : null
                   ],
                   children
                 }
@@ -20624,9 +20662,9 @@ var ModalDialog = (0, import_react121.forwardRef)(
         withoutContentPadding: true,
         css: modalDialogInnerStyles,
         width: "",
-        children: /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(VerticalRhythm, { css: modalDialogWrapper, children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(VerticalRhythm, { css: modalDialogWrapper(Boolean(onRequestClose)), children: [
           /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { css: modalHeaderStyles, children: header2 }),
-          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { children }),
+          /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { css: { flex: 1 }, children }),
           /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(HorizontalRhythm, { children: buttonGroup })
         ] })
       }
@@ -21118,7 +21156,7 @@ var ObjectListItem2 = (props) => {
             /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: header2 }),
             renderAs === "multi" ? props.children : null
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(HorizontalRhythm, { gap: "xs", align: "flex-start", children: rightSlot })
+          /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(HorizontalRhythm, { gap: "xs", align: renderAs === "multi" ? "flex-start" : "center", children: rightSlot })
         ] }),
         menuItems ? /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(HorizontalRhythm, { gap: "0", align: "flex-start", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
           Menu,
@@ -22058,7 +22096,7 @@ var ParameterImageInner = (0, import_react142.forwardRef)((props, ref) => {
         type: "text",
         id,
         ref,
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         autoComplete: "off",
         ...props
       }
@@ -22084,7 +22122,7 @@ var ParameterInputInner = (0, import_react143.forwardRef)(
         css: input3,
         id,
         type: props.type || "text",
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         autoComplete: "off",
         ref,
         ...props
@@ -22106,7 +22144,7 @@ var ParameterLink = (0, import_react144.forwardRef)(
         "data-testid": "link-parameter-editor",
         ...shellProps,
         label: innerProps.value ? shellProps.label : "",
-        title: !innerProps.value ? shellProps.label : void 0,
+        title: !innerProps.value && typeof shellProps.label === "string" ? shellProps.label : void 0,
         children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
           ParameterLinkInner,
           {
@@ -22134,7 +22172,7 @@ var ParameterLinkInner = (0, import_react144.forwardRef)(
           readOnly: Boolean(props.value),
           id,
           ref,
-          "aria-label": hiddenLabel ? label : void 0,
+          "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
           ...props
         }
       ),
@@ -22185,7 +22223,7 @@ var ParameterMultiSelectInner = (props) => {
       isMulti: true,
       isClearable: (_a = props.isClearable) != null ? _a : false,
       id,
-      "aria-label": label,
+      "aria-label": typeof label === "string" ? label : void 0,
       classNamePrefix: "parameter-multi-select-combobox",
       styles: {
         menuPortal: (base) => ({
@@ -25073,7 +25111,7 @@ var ParameterSelectInner = (0, import_react160.forwardRef)(
       {
         css: [input3, selectInput],
         id,
-        "aria-label": hiddenLabel ? label : void 0,
+        "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
         ref,
         ...props,
         children: [
@@ -25104,7 +25142,7 @@ var ParameterTextareaInner = (0, import_react161.forwardRef)(({ ...props }, ref)
       css: [input3, textarea2],
       id,
       ref,
-      "aria-label": hiddenLabel ? label : void 0,
+      "aria-label": hiddenLabel && typeof label === "string" ? label : void 0,
       ...props
     }
   );
@@ -26072,16 +26110,15 @@ var StatusBullet = ({
     Deleted: StatusDeleted
   };
   const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
-  return /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(Tooltip, { title: message != null ? message : status, children: /* @__PURE__ */ (0, import_jsx_runtime144.jsx)(
     "span",
     {
       role: "status",
       css: [StatusBulletContainer, currentStateStyles[status], statusSize],
-      title: message != null ? message : status,
       ...props,
       children: hideText ? null : message ? message : status
     }
-  );
+  ) });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "19.196.0",
+  "version": "19.196.1-alpha.8+a0a6727a3c",
   "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.3",
     "@types/react-dom": "18.3.0",
-    "@uniformdev/canvas": "^19.196.0",
-    "@uniformdev/richtext": "^19.196.0",
+    "@uniformdev/canvas": "^19.196.1-alpha.8+a0a6727a3c",
+    "@uniformdev/richtext": "^19.196.1-alpha.8+a0a6727a3c",
     "autoprefixer": "10.4.16",
     "hygen": "6.2.11",
     "postcss": "8.4.38",
@@ -79,5 +79,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "4d56631b812451d2e6d10f5a1daa95151d848785"
+  "gitHead": "a0a6727a3cc042858d337818c4331d63785da6fa"
 }