@firecms/ui 3.2.0-canary.9c3d298 → 3.3.0-canary.451aa49

package/dist/components/BooleanSwitchWithLabel.d.ts

@@ -9,9 +9,10 @@ export type BooleanSwitchWithLabelProps = BooleanSwitchProps & {
     fullWidth?: boolean;
     className?: string;
     inputClassName?: string;
+    switchAdornment?: React.ReactNode;
 };
 /**
  * Simple boolean switch.
  *
  */
-export declare const BooleanSwitchWithLabel: ({ value, position, size, invisible, onValueChange, error, label, autoFocus, disabled, className, fullWidth, inputClassName, ...props }: BooleanSwitchWithLabelProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BooleanSwitchWithLabel: ({ value, position, size, invisible, onValueChange, error, label, autoFocus, disabled, className, fullWidth, inputClassName, switchAdornment, ...props }: BooleanSwitchWithLabelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Chip.d.ts

@@ -19,4 +19,4 @@ export interface ChipProps {
 /**
  * @group Preview components
  */
-export declare function Chip({ children, colorScheme, error, outlined, onClick, icon, size, className, style }: ChipProps): import("react/jsx-runtime").JSX.Element;
+export declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ResizablePanels.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+export type ResizablePanelsProps = {
+    firstPanel: React.ReactNode;
+    secondPanel: React.ReactNode;
+    /** Whether the first panel is visible (e.g. Sidebar) */
+    showFirstPanel?: boolean;
+    /** Whether the second panel is visible (e.g. Results) */
+    showSecondPanel?: boolean;
+    /** 0-100 representing the width/height of the first panel */
+    panelSizePercent: number;
+    onPanelSizeChange: (sizePercent: number) => void;
+    minPanelSizePx?: number;
+    orientation?: 'horizontal' | 'vertical';
+    className?: string;
+};
+export declare function ResizablePanels({ firstPanel, secondPanel, showFirstPanel, showSecondPanel, panelSizePercent, onPanelSizeChange, minPanelSizePx, orientation, className }: ResizablePanelsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/SearchableSelect.d.ts

@@ -0,0 +1,48 @@
+import * as React from "react";
+export interface SearchableSelectProps {
+    /** Currently selected value. Can be one of the items or a custom string. */
+    value?: string;
+    /** Callback when the value changes (from selection or custom input). */
+    onValueChange?: (value: string) => void;
+    /** Placeholder shown when no value is selected. */
+    placeholder?: string;
+    /** Label above the field. */
+    label?: React.ReactNode | string;
+    /** Size variant. */
+    size?: "smallest" | "small" | "medium" | "large";
+    /** Whether the field is disabled. */
+    disabled?: boolean;
+    /** Whether to show an error state. */
+    error?: boolean;
+    /** Whether to use the invisible (borderless) style. */
+    invisible?: boolean;
+    /** CSS class for the trigger button. */
+    className?: string;
+    /** CSS class for the trigger input area. */
+    inputClassName?: string;
+    /** Render the selected value in a custom way in the trigger. */
+    renderValue?: (value: string) => React.ReactNode;
+    /** Whether the popover should trap focus. */
+    modalPopover?: boolean;
+    /** If true, allow accepting the typed text as the value even if it doesn't match an item. */
+    allowCustomValues?: boolean;
+    /** Portal container element. */
+    portalContainer?: HTMLElement | null;
+    /** If true, auto-open the popover on mount so the user can start typing immediately. */
+    autoFocus?: boolean;
+    /** The option items — use SearchableSelectItem. */
+    children: React.ReactNode;
+}
+export interface SearchableSelectItemProps {
+    value: string;
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare const SearchableSelect: React.ForwardRefExoticComponent<SearchableSelectProps & React.RefAttributes<HTMLButtonElement>>;
+/**
+ * A single option inside a SearchableSelect.
+ * The `value` prop is the string value that gets selected.
+ * The `children` is what's displayed in the dropdown.
+ * This component is not rendered directly — SearchableSelect reads its props.
+ */
+export declare function SearchableSelectItem(_props: SearchableSelectItemProps): null;

package/dist/components/Tabs.d.ts

@@ -1,12 +1,18 @@
 import React from "react";
+type TabsMode = "primary" | "secondary";
 export type TabsProps = {
     value: string;
     children: React.ReactNode;
     innerClassName?: string;
     className?: string;
     onValueChange: (value: string) => void;
+    /**
+     * "primary" renders the default pill-style tabs.
+     * "secondary" renders underline-style tabs suitable for inner/nested panels.
+     */
+    mode?: TabsMode;
 };
-export declare function Tabs({ value, onValueChange, className, innerClassName, children }: TabsProps): import("react/jsx-runtime").JSX.Element;
+export declare function Tabs({ value, onValueChange, className, innerClassName, children, mode }: TabsProps): import("react/jsx-runtime").JSX.Element;
 export type TabProps = {
     value: string;
     className?: string;
@@ -15,3 +21,4 @@ export type TabProps = {
     disabled?: boolean;
 };
 export declare function Tab({ value, className, innerClassName, children, disabled }: TabProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Tooltip.d.ts

@@ -15,5 +15,21 @@ export type TooltipProps = {
     className?: string;
     container?: HTMLElement;
     style?: React.CSSProperties;
-};
-export declare const Tooltip: ({ open, defaultOpen, side, delayDuration, sideOffset, align, onOpenChange, title, tooltipClassName, tooltipStyle, children, asChild, container, className, style }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "title">;
+export declare const Tooltip: React.ForwardRefExoticComponent<{
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    side?: "top" | "bottom" | "left" | "right";
+    align?: "start" | "center" | "end";
+    sideOffset?: number;
+    title?: string | React.ReactNode;
+    delayDuration?: number;
+    asChild?: boolean;
+    tooltipClassName?: string;
+    tooltipStyle?: React.CSSProperties;
+    children: React.ReactNode;
+    className?: string;
+    container?: HTMLElement;
+    style?: React.CSSProperties;
+} & Omit<React.HTMLAttributes<HTMLDivElement>, "title"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/index.d.ts

@@ -30,7 +30,9 @@ export * from "./Menubar";
 export * from "./MultiSelect";
 export * from "./Paper";
 export * from "./RadioGroup";
+export * from "./ResizablePanels";
 export * from "./SearchBar";
+export * from "./SearchableSelect";
 export * from "./Select";
 export * from "./Separator";
 export * from "./Slider";

package/dist/icons/FirestoreIcon.d.ts

@@ -0,0 +1,6 @@
+import { IconProps } from "./Icon";
+/**
+ * Firebase Firestore flame icon (monochrome, uses currentColor).
+ * @group Icons
+ */
+export declare function FirestoreIcon(props: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/icons/components/DatabaseIcon.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { IconProps } from "../Icon";
+/**
+ * @group Icons
+ */
+export declare const DatabaseIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/icons/index.d.ts

@@ -3,6 +3,7 @@ export * from "./cool_icon_keys";
 export * from "./Icon";
 export * from "./GitHubIcon";
 export * from "./HandleIcon";
+export * from "./FirestoreIcon";
 export * from "./components/_10kIcon";
 export * from "./components/_10mpIcon";
 export * from "./components/_11mpIcon";
@@ -522,6 +523,7 @@ export * from "./components/DataThresholdingIcon";
 export * from "./components/DataUsageIcon";
 export * from "./components/DatasetIcon";
 export * from "./components/DatasetLinkedIcon";
+export * from "./components/DatabaseIcon";
 export * from "./components/DateRangeIcon";
 export * from "./components/DeblurIcon";
 export * from "./components/DeckIcon";