@clickhouse/click-ui 0.0.229 → 0.0.231

package/dist/components/Dialog/Dialog.d.ts

@@ -5,7 +5,7 @@ import * as RadixDialog from "@radix-ui/react-dialog";
 export declare const Dialog: {
     ({ children, ...props }: RadixDialog.DialogProps): import("react/jsx-runtime").JSX.Element;
     Trigger: {
-        ({ children, ...props }: RadixDialog.DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
+        ({ children, asChild, ...props }: RadixDialog.DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Close: {
@@ -13,16 +13,17 @@ export declare const Dialog: {
         displayName: string;
     };
     Content: {
-        ({ title, children, showClose, onClose, forceMount, container, showOverlay, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
+        ({ title, children, showClose, onClose, forceMount, container, showOverlay, reducePadding, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
 };
 export interface DialogContentProps extends RadixDialog.DialogContentProps {
-    title: string;
+    title?: string;
     showClose?: boolean;
     forceMount?: true;
     container?: HTMLElement | null;
     children: ReactNode;
     onClose?: () => void;
     showOverlay?: boolean;
+    reducePadding?: boolean;
 }

package/dist/components/GridContainer/GridContainer.d.ts

@@ -1,10 +1,11 @@
-import { HTMLAttributes } from 'react';
+import { ComponentProps, ElementType, ReactNode } from 'react';
 
 export type FlowOptions = "row" | "column" | "row-dense" | "column-dense";
 type GapOptions = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "unset";
 type ItemsOptions = "start" | "center" | "end" | "stretch";
 type ContentOptions = "center" | "space-between" | "space-around" | "space-evenly" | "start" | "stretch" | "end" | "left" | "right";
-export interface GridContainerProps extends HTMLAttributes<HTMLDivElement> {
+export interface GridContainerProps<T extends ElementType = "div"> {
+    component?: T;
     alignItems?: ItemsOptions;
     alignContent?: ContentOptions;
     children?: React.ReactNode;
@@ -30,5 +31,6 @@ export interface GridContainerProps extends HTMLAttributes<HTMLDivElement> {
     minWidth?: string;
     overflow?: string;
 }
-declare const GridContainer: ({ alignItems, alignContent, children, columnGap, gap, gridAutoColumns, gridAutoFlow, gridAutoRows, gridTemplateAreas, gridTemplateColumns, gridTemplateRows, gridTemplate, inline, isResponsive, justifyContent, justifyItems, rowGap, height, maxHeight, minHeight, fillWidth, maxWidth, minWidth, overflow, ...props }: GridContainerProps) => import("react/jsx-runtime").JSX.Element;
-export { GridContainer };
+type GridContainerPolymorphicComponent = <T extends ElementType = "div">(props: Omit<ComponentProps<T>, keyof T> & GridContainerProps<T>) => ReactNode;
+export declare const GridContainer: GridContainerPolymorphicComponent;
+export {};

package/dist/components/Logos/MariaDB.d.ts

@@ -0,0 +1,4 @@
+import { SVGAttributes } from 'react';
+
+declare const MariaDB: (props: SVGAttributes<SVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default MariaDB;

package/dist/components/Logos/types.d.ts

@@ -1 +1 @@
-export type LogoName = "clickhouse" | "airbyte" | "aws-s3" | "aws-athena" | "aws-kinesis" | "aws-redshift" | "aws-msk" | "kafka" | "digital_ocean" | "feature_database" | "feature_hexagon" | "fivetran" | "confluent" | "hex" | "tableau" | "grafana" | "superset" | "metabase" | "microsoft" | "aws" | "gcp" | "gcs" | "azure" | "azure-blob-storage" | "azure-event-hub" | "dbeaver" | "dbt" | "jdbc" | "mysql" | "postgres" | "google" | "github" | "decodeable" | "golang" | "prequel" | "python" | "deepnote" | "nodejs" | "datagrip" | "vector" | "kubenetes" | "c#" | "redpanda" | "rust" | "hudi" | "deltalake" | "snowflake" | "mongodb" | "bigquery" | "iceberg" | "upstash" | "warpstream" | "cloudflare" | "databricks";
+export type LogoName = "clickhouse" | "airbyte" | "aws-s3" | "aws-athena" | "aws-kinesis" | "aws-redshift" | "aws-msk" | "kafka" | "digital_ocean" | "feature_database" | "feature_hexagon" | "fivetran" | "confluent" | "hex" | "tableau" | "grafana" | "superset" | "metabase" | "microsoft" | "aws" | "gcp" | "gcs" | "azure" | "azure-blob-storage" | "azure-event-hub" | "dbeaver" | "dbt" | "jdbc" | "mysql" | "postgres" | "google" | "github" | "decodeable" | "golang" | "prequel" | "python" | "deepnote" | "nodejs" | "datagrip" | "vector" | "kubenetes" | "c#" | "redpanda" | "rust" | "hudi" | "deltalake" | "snowflake" | "mongodb" | "bigquery" | "iceberg" | "upstash" | "warpstream" | "cloudflare" | "databricks" | "mariadb";

package/dist/components/Select/common/InternalSelect.d.ts

@@ -1,7 +1,11 @@
 import { SelectContainerProps, SelectGroupProps, SelectItemProps } from './types';
 import { CheckboxVariants, TextProps } from '../..';
 
-export declare const InternalSelect: ({ label, children, orientation, dir, disabled, id, error, value: selectedValues, onChange, onSelect, open, onOpenChange, name, form, allowCreateOption, customText, options, sortable, placeholder, multiple, checkbox, selectLabel, showSearch, container, useFullWidthItems, itemCharacterLimit, ...props }: SelectContainerProps) => import("react/jsx-runtime").JSX.Element;
+export interface NoAvailableOptionsFactoryProps {
+    search: string;
+    close: () => void;
+}
+export declare const InternalSelect: ({ label, children, orientation, dir, disabled, id, error, value: selectedValues, onChange, onSelect, open, onOpenChange, name, form, allowCreateOption, customText, options, sortable, placeholder, multiple, checkbox, selectLabel, showSearch, container, useFullWidthItems, itemCharacterLimit, noAvailableOptions, ...props }: SelectContainerProps) => import("react/jsx-runtime").JSX.Element;
 export declare const SelectGroup: import('react').ForwardRefExoticComponent<SelectGroupProps & import('react').RefAttributes<HTMLDivElement>>;
 export declare const SelectItem: import('react').ForwardRefExoticComponent<SelectItemProps & import('react').RefAttributes<HTMLDivElement>>;
 export type MultiSelectCheckboxItemProps = SelectItemProps & {

package/dist/components/Select/common/types.d.ts

@@ -1,6 +1,7 @@
 import { HTMLAttributes, KeyboardEvent, MouseEvent, ReactNode } from 'react';
 import { HorizontalDirection, IconName } from '../..';
 import { PopoverProps } from '@radix-ui/react-popover';
+import { NoAvailableOptionsFactoryProps } from './InternalSelect';
 
 declare type DivProps = HTMLAttributes<HTMLDivElement>;
 interface SelectItemComponentProps extends Omit<DivProps, "disabled" | "onSelect" | "value" | "children"> {
@@ -72,6 +73,13 @@ interface InternalSelectProps extends PopoverProps, Omit<HTMLAttributes<HTMLDivE
     container?: HTMLElement;
     useFullWidthItems?: boolean;
     itemCharacterLimit?: string;
+    /**
+     * Controls rendering when no options are available.
+     * - false: renders nothing
+     * - true: renders default message 'No Options found' with search term if present
+     * - ({ search: string, onClose: () => void }) => ReactNode: renders the returned node allowing dynamic content based on current search string
+     */
+    noAvailableOptions?: boolean | ((props: NoAvailableOptionsFactoryProps) => ReactNode);
 }
 export type SelectOptionProp = SelectOptionType | SelectChildrenType;
 export type SelectContainerProps = SelectOptionProp & InternalSelectProps;

package/dist/components/types.d.ts

@@ -47,7 +47,7 @@ export type { VerticalStepperProps, VerticalStepProps, } from './VerticalStepper
 export type { CardHorizontalProps } from './CardHorizontal/CardHorizontal';
 export type { CardPromotionProps } from './CardPromotion/CardPromotion';
 export type { ProgressBarProps } from './ProgressBar/ProgressBar';
-export type { GridProps, CellProps, SelectedRegion, SelectionFocus, SelectionAction, GridContextMenuItemProps, Rectangle, } from './Grid/types';
+export type { GridProps, CellProps, SelectedRegion, SelectionFocus, SelectionPos, SelectionAction, GridContextMenuItemProps, Rectangle, } from './Grid/types';
 export type { StyledLinkProps } from './Link/common';
 export type States = "default" | "active" | "disabled" | "error" | "hover";
 export type HorizontalDirection = "start" | "end";

package/dist/styles/variables.dark.json.d.ts

@@ -1029,7 +1029,7 @@ declare const _default: {
             "default": "#ffffff",
             "hover": "#ffffff",
             "active": "#ffffff",
-            "disabled": "#c0c0c0",
+            "disabled": "#808080",
             "muted": "#b3b6bd"
           },
           "background": {

package/dist/styles/variables.json.d.ts

@@ -1877,7 +1877,7 @@ declare const _default: {
             "default": "#161517",
             "hover": "#161517",
             "active": "#161517",
-            "disabled": "#c0c0c0",
+            "disabled": "#a0a0a0",
             "muted": "#696e79"
           },
           "background": {

package/dist/styles/variables.light.json.d.ts

@@ -1014,7 +1014,7 @@ declare const _default: {
             "default": "#161517",
             "hover": "#161517",
             "active": "#161517",
-            "disabled": "#c0c0c0",
+            "disabled": "#a0a0a0",
             "muted": "#696e79"
           },
           "background": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clickhouse/click-ui",
-  "version": "0.0.229",
+  "version": "0.0.231",
   "description": "Official ClickHouse design system react library",
   "type": "module",
   "license": "Apache-2.0",