@seeqdev/qomponents 0.0.218 → 0.0.220

package/dist/src/Badge/Badge.d.ts

@@ -0,0 +1,15 @@
+import { BadgeProps } from "./Badge.types.js";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/Badge/Badge.d.ts
+/**
+ * Renders a compact inline badge for feature-state labels such as new or preview.
+ */
+declare const Badge: ({
+  children,
+  variant,
+  testId,
+  extraClassNames
+}: BadgeProps) => react_jsx_runtime1.JSX.Element;
+//#endregion
+export { Badge, Badge as default };

package/dist/src/Badge/Badge.types.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from "react";
+
+//#region src/Badge/Badge.types.d.ts
+declare const badgeVariants: readonly ["new", "preview"];
+type BadgeVariant = (typeof badgeVariants)[number];
+type BadgeProps = {
+  /**
+   * The content rendered inside the badge.
+   */
+  children: ReactNode;
+  /**
+   * Visual style variant for the badge.
+   * @default 'new'
+   */
+  variant?: BadgeVariant;
+  /**
+   * Test ID attribute used to locate the badge in automated tests.
+   */
+  testId?: string;
+  /**
+   * Additional CSS classes applied to the badge element.
+   */
+  extraClassNames?: string;
+};
+//#endregion
+export { BadgeProps, BadgeVariant, badgeVariants };

package/dist/src/Badge/index.d.ts

@@ -0,0 +1,2 @@
+import { Badge } from "./Badge.js";
+export { Badge as default };

package/dist/src/SeeqActionDropdown/SeeqActionDropdown.types.d.ts

@@ -1,4 +1,5 @@
 import { TooltipComponentProps } from "../Tooltip/Tooltip.types.js";
+import React from "react";
 
 //#region src/SeeqActionDropdown/SeeqActionDropdown.types.d.ts
 
@@ -29,10 +30,10 @@ interface SeeqActionDropdownItems {
    */
   iconContainerExtraClassNames?: string;
   /**
-   * Main display text for the dropdown item.
-   * This is the primary text that users see and click on to trigger the action.
+   * Primary label for the dropdown item.
+   * This is the primary content that users see and click on to trigger the action.
    */
-  display: string;
+  display: React.ReactNode;
   /**
    * Callback function triggered when the dropdown item is clicked.
    * Use this to define the specific action that should occur when users select this item.
@@ -59,6 +60,11 @@ interface SeeqActionDropdownItems {
    * Provides additional context or explanation about what the action does.
    */
   text?: string;
+  /**
+   * When true, the item is rendered similar to the disabled state, but
+   * still allows interaction, cursor changes, and hover states.
+   */
+  dim?: boolean;
 }
 /**
  * Props for the SeeqActionDropdown component that creates specialized Seeq-branded action menus.

package/dist/src/index.build.d.ts

@@ -3,6 +3,7 @@ import Accordion from "./Accordion/Accordion.js";
 import { DEFAULT_TOOL_TIP_DELAY, TooltipComponentProps, TooltipPosition, TooltipProps, tooltipPositions } from "./Tooltip/Tooltip.types.js";
 import { AlertProps } from "./Alert/Alert.types.js";
 import { Alert } from "./Alert/Alert.js";
+import { Badge } from "./Badge/Badge.js";
 import { IconProps, IconSize, IconType, iconTypes } from "./Icon/Icon.types.js";
 import { ButtonProps, ButtonSize, ButtonType, ButtonVariant, IconPosition, buttonSizes, buttonTypes, buttonVariants, iconPositions } from "./Button/Button.types.js";
 import Button from "./Button/Button.js";
@@ -48,4 +49,4 @@ import Carousel from "./Carousel/Carousel.js";
 import { QomponentsTheme } from "./constants.js";
 import { ButtonWithDropdownProps, DropdownItems, DropdownProps, DropdownSubItem } from "./ButtonWithDropdown/ButtonWithDropdown.types.js";
 import ButtonWithDropdown from "./ButtonWithDropdown/ButtonWithDropdown.js";
-export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, Modal, ModalProps, ModalSize, Option, OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };
+export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, Modal, ModalProps, ModalSize, Option, OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };

package/dist/src/index.d.ts

@@ -3,6 +3,7 @@ import Accordion from "./Accordion/Accordion.js";
 import { DEFAULT_TOOL_TIP_DELAY, TooltipComponentProps, TooltipPosition, TooltipProps, tooltipPositions } from "./Tooltip/Tooltip.types.js";
 import { AlertProps } from "./Alert/Alert.types.js";
 import { Alert } from "./Alert/Alert.js";
+import { Badge } from "./Badge/Badge.js";
 import { IconProps, IconSize, IconType, iconTypes } from "./Icon/Icon.types.js";
 import { ButtonProps, ButtonSize, ButtonType, ButtonVariant, IconPosition, buttonSizes, buttonTypes, buttonVariants, iconPositions } from "./Button/Button.types.js";
 import Button from "./Button/Button.js";
@@ -48,4 +49,4 @@ import Carousel from "./Carousel/Carousel.js";
 import { QomponentsTheme } from "./constants.js";
 import { ButtonWithDropdownProps, DropdownItems, DropdownProps, DropdownSubItem } from "./ButtonWithDropdown/ButtonWithDropdown.types.js";
 import ButtonWithDropdown from "./ButtonWithDropdown/ButtonWithDropdown.js";
-export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, type GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, Modal, ModalProps, ModalSize, Option, type OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, type QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };
+export { Accordion, AccordionProps, Alert, AlertProps, AppendedProps, Badge, Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonType, ButtonVariant, ButtonWithDropdown, ButtonWithDropdownProps, ButtonWithPopover, ButtonWithPopoverProps, Carousel, CarouselProps, Checkbox, CheckboxProps, Collapse, CollapseProps, DEFAULT_TOOL_TIP_DELAY, DimensionStyle, DropdownItems, DropdownProps, DropdownSubItem, FormControlElement, type GroupBase, GroupedOption, Icon, IconPosition, IconProps, IconSize, IconType, InputGroup, InputGroupPlacement, InputGroupProps, InputLengthStyleProps, Modal, ModalProps, ModalSize, Option, type OptionProps, ProgressBar, ProgressBarProps, ProgressIndicatorProps, QTip, QTipDataAttributes, type QomponentsTheme, SeeqActionDropdown, SeeqActionDropdownItems, SeeqActionDropdownProps, Select, SelectComponents, SelectProps, Slider, SliderProps, SvgIconProps, SvgIconType, Tabs, TabsProps, TextArea, TextAreaProps, TextField, TextFieldProps, TitleIconPosition, ToolbarButton, ToolbarButtonProps, ToolbarButtonVariant, Tooltip, TooltipComponentProps, TooltipPosition, TooltipProps, TriggerWithDropdown, TriggerWithDropdownProps, buttonSizes, buttonTypes, buttonVariants, iconPositions, iconTypes, svgIconTypes, toolbarButtonVariants, tooltipPositions };

package/dist/styles.css

@@ -400,6 +400,9 @@
   .tw\:inline-block {
     display: inline-block;
   }
+  .tw\:inline-flex {
+    display: inline-flex;
+  }
   .tw\:h-2 {
     height: calc(var(--tw-spacing) * 2);
   }
@@ -671,6 +674,9 @@
   .tw\:gap-2 {
     gap: calc(var(--tw-spacing) * 2);
   }
+  .tw\:gap-3 {
+    gap: calc(var(--tw-spacing) * 3);
+  }
   .tw\:gap-4 {
     gap: calc(var(--tw-spacing) * 4);
   }
@@ -698,6 +704,9 @@
   .tw\:rounded-\[0\.9375rem\] {
     border-radius: 0.9375rem;
   }
+  .tw\:rounded-\[3px\] {
+    border-radius: 3px;
+  }
   .tw\:rounded-\[10px\] {
     border-radius: 10px;
   }
@@ -862,6 +871,9 @@
   .tw\:bg-red-500\! {
     background-color: var(--tw-color-red-500) !important;
   }
+  .tw\:bg-sq-badge-preview-bg {
+    background-color: var(--bg-included-2);
+  }
   .tw\:bg-sq-bg-warning {
     background-color: #fff3cd;
   }
@@ -928,6 +940,9 @@
   .tw\:bg-sq-warning {
     background-color: var(--sq-status-warning-color);
   }
+  .tw\:bg-sq-warning-bg-color {
+    background-color: var(--sq-warning-bg-color);
+  }
   .tw\:bg-sq-white {
     background-color: var(--sqw-white);
   }
@@ -982,6 +997,9 @@
   .tw\:px-6 {
     padding-inline: calc(var(--tw-spacing) * 6);
   }
+  .tw\:px-\[5px\] {
+    padding-inline: 5px;
+  }
   .tw\:px-sq-19 {
     padding-inline: 1.1875rem;
   }
@@ -1000,12 +1018,18 @@
   .tw\:py-6 {
     padding-block: calc(var(--tw-spacing) * 6);
   }
+  .tw\:py-\[2px\] {
+    padding-block: 2px;
+  }
   .tw\:py-px {
     padding-block: 1px;
   }
   .tw\:py-sq-5 {
     padding-block: 0.3125rem;
   }
+  .tw\:pt-2 {
+    padding-top: calc(var(--tw-spacing) * 2);
+  }
   .tw\:pr-1 {
     padding-right: calc(var(--tw-spacing) * 1);
   }
@@ -1049,6 +1073,9 @@
     font-size: var(--tw-text-xs);
     line-height: var(--tw-leading, var(--tw-text-xs--line-height));
   }
+  .tw\:text-\[0\.8rem\] {
+    font-size: 0.8rem;
+  }
   .tw\:text-\[20px\] {
     font-size: 20px;
   }
@@ -1132,6 +1159,12 @@
   .tw\:text-sq-text-color {
     color: #3a3a3a;
   }
+  .tw\:text-sq-text-dark-warning-color {
+    color: var(--sq-text-dark-warning-color);
+  }
+  .tw\:text-sq-text-interactive {
+    color: var(--sq-analysis-link);
+  }
   .tw\:text-sq-theme-dark {
     color: var(--theme-dark);
   }
@@ -1153,6 +1186,9 @@
   .tw\:text-white {
     color: var(--tw-color-white);
   }
+  .tw\:capitalize {
+    text-transform: capitalize;
+  }
   .tw\:italic {
     font-style: italic;
   }
@@ -1755,6 +1791,11 @@
       opacity: 50%;
     }
   }
+  .tw\:aria-disabled\:pointer-events-none {
+    &[aria-disabled="true"] {
+      pointer-events: none;
+    }
+  }
   .tw\:aria-disabled\:cursor-not-allowed {
     &[aria-disabled="true"] {
       cursor: not-allowed;
@@ -1775,9 +1816,9 @@
       pointer-events: none;
     }
   }
-  .tw\:data-\[disabled\]\:pointer-events-none {
-    &[data-disabled] {
-      pointer-events: none;
+  .tw\:data-\[dim\]\:opacity-50 {
+    &[data-dim] {
+      opacity: 50%;
     }
   }
   .tw\:data-\[disabled\]\:text-sq-disabled-gray {
@@ -1876,6 +1917,11 @@
       background-color: var(--tw-color-gray-700);
     }
   }
+  .tw\:dark\:bg-sq-bg-default-preview-dark {
+    &:where(.tw-dark, .tw-dark *) {
+      background-color: var(--bg-default-preview-dark);
+    }
+  }
   .tw\:dark\:bg-sq-colored-hover-dark {
     &:where(.tw-dark, .tw-dark *) {
       background-color: #262c36;
@@ -1906,6 +1952,11 @@
       background-color: #262c36 !important;
     }
   }
+  .tw\:dark\:bg-sq-text-dark-warning-color {
+    &:where(.tw-dark, .tw-dark *) {
+      background-color: var(--sq-text-dark-warning-color);
+    }
+  }
   .tw\:dark\:bg-sq-theme-dark {
     &:where(.tw-dark, .tw-dark *) {
       background-color: var(--theme-dark);
@@ -1966,6 +2017,11 @@
       color: #f0f6fc;
     }
   }
+  .tw\:dark\:text-sq-text-interactive-dark {
+    &:where(.tw-dark, .tw-dark *) {
+      color: var(--sq-text-interactive-dark);
+    }
+  }
   .tw\:dark\:text-sq-theme-dark {
     &:where(.tw-dark, .tw-dark *) {
       color: var(--theme-dark);
@@ -1981,6 +2037,11 @@
       color: var(--theme-link);
     }
   }
+  .tw\:dark\:text-sq-warning-bg-color {
+    &:where(.tw-dark, .tw-dark *) {
+      color: var(--sq-warning-bg-color);
+    }
+  }
   .tw\:dark\:text-sq-white {
     &:where(.tw-dark, .tw-dark *) {
       color: var(--sqw-white);
@@ -2388,6 +2449,42 @@
   text-align: center;
   width: 1.25em;
 }
+.fc-data-lab2-locked:before {
+  content: '\e9c7' !important;
+}
+.fc-data-lab2:before {
+  content: '\e9c8' !important;
+}
+.fc-folder2-locked:before {
+  content: '\e9c9' !important;
+}
+.fc-folder2:before {
+  content: '\e9ca' !important;
+}
+.fc-insights-locked:before {
+  content: '\e9cb' !important;
+}
+.fc-insights:before {
+  content: '\e9cc' !important;
+}
+.fc-organizer2-locked:before {
+  content: '\e9cd' !important;
+}
+.fc-organizer2:before {
+  content: '\e9ce' !important;
+}
+.fc-vantage2-locked:before {
+  content: '\e9cf' !important;
+}
+.fc-vantage2:before {
+  content: '\e9d0' !important;
+}
+.fc-workbench2-locked:before {
+  content: '\e9d1' !important;
+}
+.fc-workbench2:before {
+  content: '\e9d2' !important;
+}
 .fc-models:before {
   content: '\e9c6' !important;
 }
@@ -2403,6 +2500,9 @@
 .fc-view-summaries:before {
   content: '\e9c3' !important;
 }
+.fc-view-summaries1:before {
+  content: '\e9c4' !important;
+}
 .fc-marker:before {
   content: '\a961' !important;
 }
@@ -3353,6 +3453,7 @@
   --sq-gray-text: #869298;
   --sq-gray-text-dark: #9198a1;
   --sq-text-muted: #6c757d;
+  --sq-text-interactive-dark: #1fcfa6;
   --sq-darker-gray: #e7e7e7;
   --sq-darker-gray-dark: #21262d;
   --sqw-disabled-gray: #dde1e3;
@@ -3454,6 +3555,7 @@
   --bg-table-highlight-hover: #faf2cc;
   --bg-highlight: #e6d4a3;
   --bg-highlight-hover: #e0c65c;
+  --bg-default-preview-dark: #1e4032;
   --sq-brand-header: #062f41;
   --sq-report-color: #39516b;
   --sq-analysis-color: #427c63;
@@ -3475,6 +3577,7 @@
   --sqw-danger-color: #d9534f;
   --sqw-warning-color: #f0ad4e;
   --sq-text-warning-color: #f0ad4e;
+  --sq-warning-bg-color: #fce7ce;
   --sq-text-dark-warning-color: #664d03;
   --sq-flag-icon-light-color: #b85559;
   --sq-flag-icon-dark-color: #c77a7b;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seeqdev/qomponents",
-  "version": "0.0.218",
+  "version": "0.0.220",
   "type": "module",
   "main": "dist/index.js",
   "source": "src/index.ts",