@mastra/playground-ui 64.0.0-alpha.8 → 64.0.0

package/dist/src/ds/components/Combobox/combobox-parts.d.ts

@@ -0,0 +1,102 @@
+import { Combobox as BaseCombobox } from '@base-ui/react/combobox';
+import { ComboboxVariant } from './combobox-styles';
+import { ButtonSize, TextButtonSize } from '../Button/Button';
+import { PortalContainer } from '../../primitives/portal-container';
+import * as React from 'react';
+/**
+ * Root. Same props as Base UI's `Combobox.Root` (`items`, `value`, `onValueChange`, `multiple`,
+ * `autoHighlight`, `filter`, ...). Pick one of three shapes:
+ * - Search in the field: `ComboboxInput` + `ComboboxContent`.
+ * - Multiple, chips in the field: `ComboboxChips` (chips + `ComboboxChipsInput`) + `ComboboxContent`.
+ * - Compact trigger, search in the popup: `ComboboxTrigger` + `ComboboxContent` starting with
+ *   `ComboboxSearch`. For small triggers (an icon, a ghost button in a toolbar).
+ */
+declare function ComboboxRoot<Value, Multiple extends boolean | undefined = false>(props: BaseCombobox.Root.Props<Value, Multiple>): React.JSX.Element;
+/**
+ * The selected value, for a compact `ComboboxTrigger` or a custom display. `children` can be a
+ * function of the value; `placeholder` shows while nothing is selected.
+ */
+declare function ComboboxValue(props: BaseCombobox.Value.Props): React.JSX.Element;
+type ComboboxTriggerProps = Omit<BaseCombobox.Trigger.Props, 'className'> & {
+    className?: string;
+    /** The Button-recipe look, like Select: `default` (field surface), `outline` or `ghost`. */
+    variant?: ComboboxVariant;
+    /** Icon sizes (`icon-*`) show only `icon` (or the chevron); `children` stay as accessible text. */
+    size?: ButtonSize;
+    /** Shown before the value, or alone at icon sizes (e.g. a filter icon), replacing the chevron there. */
+    icon?: React.ReactNode;
+    showChevron?: boolean;
+};
+/**
+ * A compact trigger that opens the list, with the search inside the popup (`ComboboxSearch`). For
+ * small triggers such as an icon or a ghost button; a form field uses ComboboxInput instead.
+ * `children` is what the trigger shows, usually `<ComboboxValue placeholder="…" />`.
+ */
+declare function ComboboxTrigger({ className, children, variant, size, icon, showChevron, ...props }: ComboboxTriggerProps): React.JSX.Element;
+/** An × that clears the value. ComboboxInput renders it with `showClear`. */
+declare function ComboboxClear({ className, ...props }: BaseCombobox.Clear.Props): React.JSX.Element;
+type ComboboxInputProps = Omit<BaseCombobox.Input.Props, 'size'> & {
+    /** The field height, from the control sizes. `md` by default. */
+    size?: TextButtonSize;
+    /** Shown before the text, e.g. the selected item's icon. */
+    start?: React.ReactNode;
+    /** The chevron button at the end. On by default. */
+    showTrigger?: boolean;
+    /** An × before the chevron that clears the value. */
+    showClear?: boolean;
+};
+/**
+ * The field you type in to filter, showing the selected value while it's closed. `children` render
+ * inside the field before the chevron (e.g. a muted "4 items" detail). The list opens at the
+ * field's width. Inside a `Field`, the label and errors link to it.
+ */
+declare function ComboboxInput({ className, children, showTrigger, showClear, size, start, onFocus, ...props }: ComboboxInputProps): React.JSX.Element;
+/**
+ * The search row at the top of the popup, for a compact `ComboboxTrigger`. The same row as today's
+ * Combobox: a search icon, a borderless input and a hairline under it.
+ */
+declare function ComboboxSearch({ className, ...props }: BaseCombobox.Input.Props): React.JSX.Element;
+type ComboboxContentProps = BaseCombobox.Popup.Props & Pick<BaseCombobox.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> & {
+    /** Where the popup portals to. Defaults to the nearest dialog or drawer, so it stays interactive there. */
+    container?: PortalContainer;
+};
+/**
+ * The popup. Under a field (ComboboxInput or ComboboxChips) it opens at the field's width; under a
+ * compact ComboboxTrigger it takes the trigger's width, at least 11rem. Either way the width never
+ * follows the filtered items, so it holds still while you type; long labels truncate.
+ */
+declare function ComboboxContent({ className, side, sideOffset, align, alignOffset, anchor, container, ...props }: ComboboxContentProps): React.JSX.Element;
+/** The scrolling list. Children: a render function per item (or per group), like Base UI's List. */
+declare function ComboboxList({ className, ...props }: BaseCombobox.List.Props): React.JSX.Element;
+/** One option. A check shows on the right while it's selected; the hover highlight slides between items. */
+declare function ComboboxItem({ className, children, ref, ...props }: BaseCombobox.Item.Props): React.JSX.Element;
+/** Title over a description inside an item (shadcn's Item / ItemTitle / ItemDescription). */
+declare function ComboboxItemContent({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+declare function ComboboxItemTitle({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+/** Muted, up to two lines. */
+declare function ComboboxItemDescription({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+/** Muted text at the end of an item, e.g. its kind ("Agent"). */
+declare function ComboboxItemEnd({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+/** A section of items. Pass the section's `items`; render them with ComboboxCollection. */
+declare function ComboboxGroup(props: BaseCombobox.Group.Props): React.JSX.Element;
+/** A group's heading, styled like menu section labels. */
+declare function ComboboxLabel({ className, ...props }: BaseCombobox.GroupLabel.Props): React.JSX.Element;
+/** Renders a group's filtered items, one render function call per item. */
+declare function ComboboxCollection(props: BaseCombobox.Collection.Props): React.JSX.Element;
+/** Shows its children only when the filter matches nothing. */
+declare function ComboboxEmpty({ className, ...props }: BaseCombobox.Empty.Props): React.JSX.Element;
+declare function ComboboxSeparator({ className, ...props }: BaseCombobox.Separator.Props): React.JSX.Element;
+/**
+ * Multi-select field: chips for the picked items, then ComboboxChipsInput. The chips and input wrap
+ * inside their own area so the chevron keeps its place on the first row. While the field is one
+ * line it keeps the pill shape of every other field; once chips wrap it takes the Textarea corner.
+ */
+declare function ComboboxChips({ className, children, ...props }: BaseCombobox.Chips.Props): React.JSX.Element;
+/** One picked item inside ComboboxChips. The × (or Backspace in the input) removes it. */
+declare function ComboboxChip({ className, children, showRemove, ...props }: BaseCombobox.Chip.Props & {
+    showRemove?: boolean;
+}): React.JSX.Element;
+/** The text input after the chips in ComboboxChips. */
+declare function ComboboxChipsInput({ className, onFocus, ...props }: BaseCombobox.Input.Props): React.JSX.Element;
+export type { ComboboxTriggerProps, ComboboxInputProps, ComboboxContentProps };
+export { ComboboxRoot, ComboboxInput, ComboboxTrigger, ComboboxSearch, ComboboxValue, ComboboxClear, ComboboxContent, ComboboxList, ComboboxItem, ComboboxItemContent, ComboboxItemTitle, ComboboxItemDescription, ComboboxItemEnd, ComboboxGroup, ComboboxLabel, ComboboxCollection, ComboboxEmpty, ComboboxSeparator, ComboboxChips, ComboboxChip, ComboboxChipsInput, };

package/dist/src/ds/components/Combobox/combobox.d.ts

@@ -1,5 +1,6 @@
 import { ComboboxVariant } from './combobox-styles';
 import { ButtonSize } from '../Button/Button';
+import { PortalContainer } from '../../primitives/portal-container';
 import * as React from 'react';
 export type { ComboboxVariant } from './combobox-styles';
 export type ComboboxOption = {
@@ -15,16 +16,21 @@ export type ComboboxOption = {
 type ComboboxSharedProps = {
     options: ComboboxOption[];
     placeholder?: React.ReactNode;
+    /** The search row's placeholder for compact triggers. A field (inside a `Field`) searches in itself and shows `placeholder`. */
     searchPlaceholder?: string;
     emptyText?: string;
     className?: string;
     disabled?: boolean;
+    /**
+     * `default` inside a `Field` is a form field you type in to search. `ghost` (and the legacy `outline`/`link`),
+     * or any variant outside a `Field`, is a compact trigger with the search inside the popup.
+     */
     variant?: ComboboxVariant;
-    /** Icon sizes (`icon-*`) render a chevron-only trigger; pass `aria-label` to name it. */
+    /** Icon sizes (`icon-*`) render a chevron-only trigger with the search in the popup; pass `aria-label` to name it. */
     size?: ButtonSize;
     open?: boolean;
     onOpenChange?: (open: boolean) => void;
-    container?: HTMLElement | ShadowRoot | null | React.RefObject<HTMLElement | ShadowRoot | null>;
+    container?: PortalContainer;
     id?: string;
     'aria-label'?: string;
     'aria-describedby'?: string;
@@ -33,7 +39,7 @@ type ComboboxSharedProps = {
     showChevron?: boolean;
     iconOnlyValue?: boolean;
     allowCustomValue?: boolean;
-    /** Called with the search input text as it changes (and with `''` after a single-mode selection resets it). */
+    /** Called with the search text as it changes (and with `''` after a compact trigger's selection resets it). */
     onInputValueChange?: (value: string) => void;
     /** @deprecated Wrap the combobox in `<Field invalid>` with a `FieldError`. */
     error?: string;
@@ -52,4 +58,12 @@ export type ComboboxMultipleProps = ComboboxSharedProps & {
     clearLabel?: string;
 };
 export type ComboboxProps = ComboboxSingleProps | ComboboxMultipleProps;
+/**
+ * A searchable select driven by `options`, built on the Combobox parts.
+ *
+ * Inside a `Field`, a `default` combobox searches right in the field: a text field for a single value,
+ * removable chips for `multiple`. Everywhere else (outside a `Field`, `ghost` and icon-size triggers,
+ * custom non-text placeholders) it keeps a compact trigger with the search inside the popup. For anything
+ * these props don't cover (groups, rich items), compose the parts directly (`ComboboxRoot`, ...).
+ */
 export declare function Combobox(props: ComboboxProps): React.JSX.Element;

package/dist/src/ds/components/Combobox/index.d.ts

@@ -1,3 +1,4 @@
 export * from './combobox';
+export * from './combobox-parts';
 export { comboboxStyles } from './combobox-styles';
 export { Combobox as ComboboxPrimitive } from '@base-ui/react/combobox';

package/dist/src/ds/components/DataList/TracesDataList/traces-data-list-cells.d.ts

@@ -11,6 +11,13 @@ export interface TracesDataListInputCellProps {
     input?: string | null;
 }
 export declare function TracesDataListInputCell({ input }: TracesDataListInputCellProps): import("react").JSX.Element;
+export interface TracesDataListOutputCellProps {
+    output?: string;
+    /** Shown instead of `output`, in the error color, when `status` is `'error'`. */
+    error?: string;
+    status?: string | null;
+}
+export declare function TracesDataListOutputCell({ output, error, status }: TracesDataListOutputCellProps): import("react").JSX.Element;
 export interface TracesDataListTypeCellProps {
     entityType?: string | null;
 }

package/dist/src/ds/components/DataList/TracesDataList/traces-data-list.d.ts

@@ -8,7 +8,7 @@ import { DataListSpacer } from '../data-list-spacer';
 import { DataListSubHeading } from '../data-list-subheading';
 import { DataListTop } from '../data-list-top';
 import { DataListTopCellWithTooltip } from '../data-list-top-cell';
-import { TracesDataListNameCell, TracesDataListInputCell, TracesDataListTypeCell, TracesDataListStatusCell } from './traces-data-list-cells';
+import { TracesDataListNameCell, TracesDataListInputCell, TracesDataListOutputCell, TracesDataListTypeCell, TracesDataListStatusCell } from './traces-data-list-cells';
 declare function TracesDataListRoot(props: ComponentProps<typeof DataListRoot>): import("react").JSX.Element;
 export declare const TracesDataList: typeof TracesDataListRoot & {
     Top: typeof DataListTop;
@@ -29,6 +29,7 @@ export declare const TracesDataList: typeof TracesDataListRoot & {
     CreatedCell: typeof DataListCreatedCell;
     NameCell: typeof TracesDataListNameCell;
     InputCell: typeof TracesDataListInputCell;
+    OutputCell: typeof TracesDataListOutputCell;
     TypeCell: typeof TracesDataListTypeCell;
     StatusCell: typeof TracesDataListStatusCell;
     NextPageLoading: typeof DataListNextPageLoading;

package/dist/src/ds/components/Meter/index.d.ts

@@ -0,0 +1,2 @@
+export * from './meter';
+export * from './meter-source';

package/dist/src/ds/components/Meter/meter-context.d.ts

@@ -0,0 +1,6 @@
+export type MeterPart = 'bar' | 'key';
+export declare const MeterPartContext: import('react').Context<{
+    part: MeterPart;
+    format: (value: number) => string;
+}>;
+export declare const sourceColorClassName: string;

package/dist/src/ds/components/Meter/meter-key-row.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export declare function MeterKeyRow({ swatch, label, amount }: {
+    swatch: string;
+    label: ReactNode;
+    amount: string;
+}): import("react").JSX.Element;

package/dist/src/ds/components/Meter/meter-root.d.ts

@@ -0,0 +1,14 @@
+import { ComponentProps, ReactNode } from 'react';
+export type MeterProps = Omit<ComponentProps<'span'>, 'children'> & {
+    value: number;
+    max: number;
+    children?: ReactNode;
+    format?: (value: number) => string;
+} & ({
+    'aria-label': string;
+    'aria-labelledby'?: never;
+} | {
+    'aria-label'?: never;
+    'aria-labelledby': string;
+});
+export declare function MeterRoot({ value, max, children, format, className, ...props }: MeterProps): import("react").JSX.Element;

package/dist/src/ds/components/Meter/meter-segment.d.ts

@@ -0,0 +1,5 @@
+export declare function MeterSegment({ slot, grow, className }: {
+    slot: string;
+    grow: number;
+    className: string;
+}): import("react").JSX.Element;

package/dist/src/ds/components/Meter/meter-source.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+export type MeterSourceProps = {
+    label: ReactNode;
+    value: number;
+};
+export declare function MeterSource({ label, value }: MeterSourceProps): import("react").JSX.Element;

package/dist/src/ds/components/Meter/meter.d.ts

@@ -0,0 +1,6 @@
+import { MeterRoot } from './meter-root';
+import { MeterSource } from './meter-source';
+export type { MeterProps } from './meter-root';
+export declare const Meter: typeof MeterRoot & {
+    Source: typeof MeterSource;
+};

package/dist/src/ds/components/MetricsStackedBarChart/metrics-stacked-bar-chart.d.ts

@@ -42,6 +42,7 @@ export type MetricsStackedBarChartProps = {
     xLabels?: ChartXLabels;
     /** Row field for the tooltip heading (e.g. a longer date); defaults to the x-axis label. */
     tooltipLabelKey?: string;
+    columnLabelKey?: string;
     /** Click a column (e.g. to open its traces); the plot shows a pointer cursor. */
     onBucketClick?: (row: Record<string, unknown>, index: number) => void;
     /** One dashed line over the bars, on its own hidden scale (e.g. a duration over counts). */

package/dist/src/ds/components/Table/Table.d.ts

@@ -25,8 +25,10 @@ export declare namespace Table {
     var SortButton: typeof TableSortButton;
     var Pagination: typeof TablePagination;
 }
-export type TableHeaderProps = ComponentProps<'thead'>;
-declare function TableHeader({ className, ...props }: TableHeaderProps): import("react").JSX.Element;
+export type TableHeaderProps = ComponentProps<'thead'> & {
+    placement?: 'above' | 'inside';
+};
+declare function TableHeader({ className, placement, ...props }: TableHeaderProps): import("react").JSX.Element;
 export interface TheadProps {
     className?: string;
     children: ReactNode;

package/dist/style.css

@@ -714,6 +714,10 @@
     inset-inline: 1px;
   }
 
+  .-inset-y-1 {
+    inset-block: calc(var(--spacing) * -1);
+  }
+
   .inset-y-\(--attachment-action-inset\) {
     inset-block: var(--attachment-action-inset);
   }
@@ -794,6 +798,10 @@
     right: var(--attachment-action-inset);
   }
 
+  .right-\(--meter-over\) {
+    right: var(--meter-over);
+  }
+
   .right-0 {
     right: 0;
   }
@@ -1986,6 +1994,11 @@
     height: calc(var(--spacing) * 5);
   }
 
+  .size-5\.5 {
+    width: calc(var(--spacing) * 5.5);
+    height: calc(var(--spacing) * 5.5);
+  }
+
   .size-6 {
     width: calc(var(--spacing) * 6);
     height: calc(var(--spacing) * 6);
@@ -2106,6 +2119,11 @@
     height: var(--spacing-icon-lg);
   }
 
+  .size-icon-sm {
+    width: var(--spacing-icon-sm);
+    height: var(--spacing-icon-sm);
+  }
+
   .size-icon-xs {
     width: var(--spacing-icon-xs);
     height: var(--spacing-icon-xs);
@@ -2163,6 +2181,10 @@
     height: calc(var(--spacing) * 5);
   }
 
+  .h-5\.5 {
+    height: calc(var(--spacing) * 5.5);
+  }
+
   .h-6 {
     height: calc(var(--spacing) * 6);
   }
@@ -2731,6 +2753,10 @@
     min-height: 100vh;
   }
 
+  .w-\(--anchor-width\) {
+    width: var(--anchor-width);
+  }
+
   .w-\(--attachment-action-width\) {
     width: var(--attachment-action-width);
   }
@@ -2739,6 +2765,10 @@
     width: var(--field-width, 100%);
   }
 
+  .w-\(--meter-over\) {
+    width: var(--meter-over);
+  }
+
   .w-\(--sidebar-width\) {
     width: var(--sidebar-width);
   }
@@ -3155,6 +3185,10 @@
     width: calc(var(--sidebar-width) - 1rem);
   }
 
+  .w-\[max\(11rem\,var\(--anchor-width\)\)\] {
+    width: max(11rem, var(--anchor-width));
+  }
+
   .w-\[min\(24rem\,calc\(100vw-2rem\)\)\] {
     width: min(24rem, 100vw - 2rem);
   }
@@ -3495,6 +3529,10 @@
     min-width: calc(var(--spacing) * .5);
   }
 
+  .min-w-1 {
+    min-width: var(--spacing);
+  }
+
   .min-w-1\.5 {
     min-width: calc(var(--spacing) * 1.5);
   }
@@ -3655,6 +3693,10 @@
     flex-grow: 1;
   }
 
+  .grow-\(--meter-share\) {
+    flex-grow: var(--meter-share);
+  }
+
   .basis-0 {
     flex-basis: 0;
   }
@@ -4301,6 +4343,10 @@
     gap: .75em;
   }
 
+  .gap-\[3px\] {
+    gap: 3px;
+  }
+
   .gap-\[6px\] {
     gap: 6px;
   }
@@ -4394,6 +4440,10 @@
     column-gap: calc(var(--spacing) * 5);
   }
 
+  .gap-x-10 {
+    column-gap: calc(var(--spacing) * 10);
+  }
+
   :where(.space-x-2 > :not(:last-child)) {
     --tw-space-x-reverse: 0;
     margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
@@ -4420,6 +4470,10 @@
     row-gap: calc(var(--spacing) * 3);
   }
 
+  .gap-y-6 {
+    row-gap: calc(var(--spacing) * 6);
+  }
+
   .gap-y-px {
     row-gap: 1px;
   }
@@ -4656,6 +4710,11 @@
     border-bottom-right-radius: var(--radius-3xl);
   }
 
+  .rounded-r-full {
+    border-top-right-radius: 3.40282e38px;
+    border-bottom-right-radius: 3.40282e38px;
+  }
+
   .rounded-r-md {
     border-top-right-radius: var(--radius-md);
     border-bottom-right-radius: var(--radius-md);
@@ -4914,6 +4973,10 @@
     background-color: var(--data-list-background);
   }
 
+  .bg-\(--meter-source\) {
+    background-color: var(--meter-source);
+  }
+
   .bg-\[var\(--tab-indicator-color\,var\(--fill-hover\)\)\] {
     background-color: var(--tab-indicator-color, var(--fill-hover));
   }
@@ -6242,6 +6305,14 @@
     padding-top: calc(var(--spacing) * 12);
   }
 
+  .pt-24 {
+    padding-top: calc(var(--spacing) * 24);
+  }
+
+  .pt-40 {
+    padding-top: calc(var(--spacing) * 40);
+  }
+
   .pt-\[env\(safe-area-inset-top\)\] {
     padding-top: env(safe-area-inset-top);
   }
@@ -6298,6 +6369,10 @@
     padding-right: calc(var(--spacing) * 12);
   }
 
+  .pr-\[5\.5px\] {
+    padding-right: 5.5px;
+  }
+
   .pb-\(--chat-gutter\) {
     padding-bottom: var(--chat-gutter);
   }
@@ -6414,6 +6489,10 @@
     padding-left: .9em;
   }
 
+  .pl-\[3\.5px\] {
+    padding-left: 3.5px;
+  }
+
   .pl-\[18px\] {
     padding-left: 18px;
   }
@@ -6422,6 +6501,10 @@
     padding-left: 2.75em;
   }
 
+  .pl-\[calc\(0\.9em_-_4px\)\] {
+    padding-left: calc(.9em - 4px);
+  }
+
   .pl-\[calc\(var\(--text-label\)\*2\.75\+1px\)\] {
     padding-left: calc(var(--text-label) * 2.75 + 1px);
   }
@@ -8090,7 +8173,15 @@
       background-color: var(--fill-subtle);
     }
 
-    .group-hover\/message\:opacity-100:is(:where(.group\/message):hover *), .group-hover\/metrics-card\:opacity-100:is(:where(.group\/metrics-card):hover *), .group-hover\/resize\:opacity-100:is(:where(.group\/resize):hover *) {
+    .group-hover\/message\:opacity-100:is(:where(.group\/message):hover *) {
+      opacity: 1;
+    }
+
+    .group-hover\/meter\:opacity-0:is(:where(.group\/meter):hover *) {
+      opacity: 0;
+    }
+
+    .group-hover\/meter\:opacity-100:is(:where(.group\/meter):hover *), .group-hover\/metrics-card\:opacity-100:is(:where(.group\/metrics-card):hover *), .group-hover\/resize\:opacity-100:is(:where(.group\/resize):hover *) {
       opacity: 1;
     }
 
@@ -8154,6 +8245,14 @@
     --tw-ring-color: var(--border-focus);
   }
 
+  .group-focus-visible\/meter\:opacity-0:is(:where(.group\/meter):focus-visible *) {
+    opacity: 0;
+  }
+
+  .group-focus-visible\/meter\:opacity-100:is(:where(.group\/meter):focus-visible *) {
+    opacity: 1;
+  }
+
   .group-focus-visible\/resize\:via-border-focus:is(:where(.group\/resize):focus-visible *) {
     --tw-gradient-via: var(--border-focus);
     --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
@@ -8622,6 +8721,11 @@
     inset-block: calc(var(--spacing) * -1.5);
   }
 
+  .before\:-inset-y-2:before {
+    content: var(--tw-content);
+    inset-block: calc(var(--spacing) * -2);
+  }
+
   .before\:inset-y-0:before {
     content: var(--tw-content);
     inset-block: 0;
@@ -9460,6 +9564,14 @@
     .not-disabled\:hover\:text-foreground:not(:disabled):hover {
       color: var(--foreground);
     }
+
+    .not-data-disabled\:hover\:bg-fill:not([data-disabled]):hover {
+      background-color: var(--fill);
+    }
+
+    .not-data-disabled\:hover\:text-foreground:not([data-disabled]):hover {
+      color: var(--foreground);
+    }
   }
 
   .focus\:border-border-focus:focus {
@@ -9949,6 +10061,14 @@
     cursor: pointer;
   }
 
+  .has-\[input\:disabled\]\:cursor-not-allowed:has(:is(input:disabled)) {
+    cursor: not-allowed;
+  }
+
+  .has-\[input\:disabled\]\:bg-field-disabled:has(:is(input:disabled)) {
+    background-color: var(--field-disabled);
+  }
+
   .has-\[textarea\]\:h-auto:has(:is(textarea)) {
     height: auto;
   }
@@ -10168,7 +10288,15 @@
     color: var(--destructive-foreground);
   }
 
-  .data-highlighted\:text-foreground[data-highlighted], .data-selected\:text-foreground[data-selected], .data-sorted\:text-foreground[data-sorted], .data-\[active\]\:text-foreground[data-active] {
+  .data-highlighted\:text-foreground[data-highlighted] {
+    color: var(--foreground);
+  }
+
+  .data-multiline\:rounded-xl[data-multiline] {
+    border-radius: var(--radius-xl);
+  }
+
+  .data-selected\:text-foreground[data-selected], .data-sorted\:text-foreground[data-sorted], .data-\[active\]\:text-foreground[data-active] {
     color: var(--foreground);
   }
 
@@ -11887,6 +12015,14 @@
     }
   }
 
+  .has-\[input\:disabled\]\:\[\&_\*\]\:cursor-not-allowed:has(:is(input:disabled)) * {
+    cursor: not-allowed;
+  }
+
+  .has-\[input\:disabled\]\:\[\&_\*\]\:text-muted-foreground:has(:is(input:disabled)) * {
+    color: var(--muted-foreground);
+  }
+
   .\[\&_\*\:focus\:not\(\:focus-visible\)\]\:outline-none :focus:not(:focus-visible) {
     --tw-outline-style: none;
     outline-style: none;
@@ -12180,6 +12316,10 @@
     .not-disabled\:hover\:\[\&_svg\]\:text-foreground:not(:disabled):hover svg {
       color: var(--foreground);
     }
+
+    .not-disabled\:hover\:\[\&_svg\]\:text-muted-foreground:not(:disabled):hover svg {
+      color: var(--muted-foreground);
+    }
   }
 
   .aria-disabled\:\[\&_svg\]\:text-muted-foreground[aria-disabled="true"] svg {
@@ -12597,6 +12737,26 @@
     grid-column: 1 / -1;
   }
 
+  .\[\&\>\:nth-child\(5n\)\]\:\[--meter-source\:var\(--chart-share-5\)\] > :nth-child(5n) {
+    --meter-source: var(--chart-share-5);
+  }
+
+  .\[\&\>\:nth-child\(5n\+1\)\]\:\[--meter-source\:var\(--chart-share-1\)\] > :nth-child(5n+1) {
+    --meter-source: var(--chart-share-1);
+  }
+
+  .\[\&\>\:nth-child\(5n\+2\)\]\:\[--meter-source\:var\(--chart-share-2\)\] > :nth-child(5n+2) {
+    --meter-source: var(--chart-share-2);
+  }
+
+  .\[\&\>\:nth-child\(5n\+3\)\]\:\[--meter-source\:var\(--chart-share-3\)\] > :nth-child(5n+3) {
+    --meter-source: var(--chart-share-3);
+  }
+
+  .\[\&\>\:nth-child\(5n\+4\)\]\:\[--meter-source\:var\(--chart-share-4\)\] > :nth-child(5n+4) {
+    --meter-source: var(--chart-share-4);
+  }
+
   .\[\&\>\[data-slot\=avatar\]\]\:border-0 > [data-slot="avatar"] {
     border-style: var(--tw-border-style);
     border-width: 0;
@@ -13078,6 +13238,27 @@
     border-bottom-left-radius: var(--radius-lg);
   }
 
+  .\[\&\>tr\>th\]\:border-b > tr > th {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+  }
+
+  .\[\&\>tr\>th\]\:bg-background > tr > th {
+    background-color: var(--background);
+  }
+
+  .\[\&\>tr\>th\]\:bg-clip-padding > tr > th {
+    background-clip: padding-box;
+  }
+
+  .\[\&\>tr\>th\:first-child\]\:rounded-tl-lg > tr > th:first-child {
+    border-top-left-radius: var(--radius-lg);
+  }
+
+  .\[\&\>tr\>th\:last-child\]\:rounded-tr-lg > tr > th:last-child {
+    border-top-right-radius: var(--radius-lg);
+  }
+
   .\[\&\[type\=number\]\]\:\[appearance\:textfield\][type="number"] {
     appearance: textfield;
   }
@@ -13098,6 +13279,19 @@
     display: none;
   }
 
+  [data-slot="combobox-chip"] ~ .\[\[data-slot\=combobox-chip\]\~\&\]\:pl-1 {
+    padding-left: var(--spacing);
+  }
+
+  thead[data-placement="inside"] + .\[thead\[data-placement\=inside\]\+\&\>tr\:first-child_\[data-row-target\]\]\:after\:rounded-none > tr:first-child [data-row-target]:after {
+    content: var(--tw-content);
+    border-radius: var(--radius-none);
+  }
+
+  thead[data-placement="inside"] + .\[thead\[data-placement\=inside\]\+\&\>tr\:first-child\>td\]\:rounded-none > tr:first-child > td {
+    border-radius: var(--radius-none);
+  }
+
   .shiki-token {
     color: var(--shiki-light, var(--foreground));
     background-color: var(--shiki-light-bg, transparent);