npm - @mastra/playground-ui - Versions diffs - 60.0.0-alpha.9 → 60.0.0 - Mend

@mastra/playground-ui 60.0.0-alpha.9 → 60.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (850) hide show

package/dist/src/ds/components/DataList/shared.d.ts CHANGED Viewed

@@ -25,8 +25,8 @@ export declare const dataListRowStateStyles: readonly ["active:bg-fill", "focus-
  * Layout and focus for the interactive element. The background lives on the
  * outer row element so it sits inside the root surface.
  */
-export declare const dataListRowInteractiveStyles: readonly ["grid grid-cols-subgrid gap-4 px-3 cursor-pointer", "outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-border-focus"];
-export declare const dataListRowStyles: readonly ["grid grid-cols-subgrid gap-4 px-3 cursor-pointer", "outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-border-focus", "group/data-list-row data-list-row col-span-full relative min-h-9", "before:absolute before:inset-0 before:-z-2 before:rounded-[inherit] before:bg-background before:content-['']", "active:bg-fill", "focus-visible:bg-surface-panel has-focus-visible:bg-surface-panel", "data-featured:before:bg-surface-panel has-data-featured:before:bg-surface-panel has-data-selected:before:bg-surface-panel", "data-[variant=error]:bg-destructive-subtle has-data-[variant=error]:bg-destructive-subtle data-[variant=error]:active:bg-destructive-subtle-active has-data-[variant=error]:active:bg-destructive-subtle-active"];
+export declare const dataListRowInteractiveStyles: readonly ["grid grid-cols-subgrid gap-4 px-3 cursor-pointer", "focus-visible:outline-1 focus-visible:outline-solid focus-visible:outline-border-focus focus-visible:-outline-offset-1"];
+export declare const dataListRowStyles: readonly ["grid grid-cols-subgrid gap-4 px-3 cursor-pointer", "focus-visible:outline-1 focus-visible:outline-solid focus-visible:outline-border-focus focus-visible:-outline-offset-1", "group/data-list-row data-list-row col-span-full relative min-h-9", "before:absolute before:inset-0 before:-z-2 before:rounded-[inherit] before:bg-background before:content-['']", "active:bg-fill", "focus-visible:bg-surface-panel has-focus-visible:bg-surface-panel", "data-featured:before:bg-surface-panel has-data-featured:before:bg-surface-panel has-data-selected:before:bg-surface-panel", "data-[variant=error]:bg-destructive-subtle has-data-[variant=error]:bg-destructive-subtle data-[variant=error]:active:bg-destructive-subtle-active has-data-[variant=error]:active:bg-destructive-subtle-active"];
 export declare const dataListRowStaticStyles: readonly ["grid grid-cols-subgrid gap-4 px-3", "group/data-list-row data-list-row col-span-full relative min-h-9", "before:absolute before:inset-0 before:-z-2 before:rounded-[inherit] before:bg-background before:content-['']"];
 /**
  * Row actions that stay out of the way until the row is hovered or focused.

package/dist/src/ds/components/Entity/entity.stories.d.ts CHANGED Viewed

@@ -6,5 +6,4 @@ type Story = StoryObj<typeof Entity>;
 export declare const Default: Story;
 export declare const Clickable: Story;
 export declare const WithCustomContent: Story;
-export declare const EntityList: Story;
 export declare const MinimalEntity: Story;

package/dist/src/ds/primitives/form-element.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ export declare const sharedFormElementDisabledStyle = "disabled:cursor-not-allow
 export declare const inputFocusBorderVisible = "focus-visible:border-border-focus";
 export declare const inputFocusBorderWithin = "focus-within:border-border-focus";
 export declare const controlFocusBorderVisible = "outline-hidden focus-visible:outline-hidden focus-visible:border-border-focus";
+export declare const surfaceRimFocus = "focus-visible:outline-hidden focus-visible:[--surface-rim:var(--border-focus)]";
 export declare const fieldErrorRim = "[--field-rim:var(--destructive-indicator)] [--field-rim-focus:var(--destructive-indicator)]";
 export declare const fieldErrorRimWithin = "has-[[aria-invalid=true]]:[--field-rim:var(--destructive-indicator)] has-[[aria-invalid=true]]:[--field-rim-focus:var(--destructive-indicator)]";
 export declare const fieldTriggerStyle: string;

package/dist/src/ds/primitives/transitions.d.ts CHANGED Viewed

@@ -13,11 +13,8 @@ export declare const hoverEffects: {
     readonly brightness: "hover:brightness-110";
     readonly lift: "hover:bg-foreground/10";
 };
-export declare const focusRing: {
-    readonly default: "focus:outline-hidden focus:ring-1 focus:ring-border-focus focus:shadow-focus-ring";
-    readonly simple: "focus:outline-hidden focus:ring-1 focus:ring-border-focus";
-    readonly visible: "focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-border-focus focus-visible:shadow-focus-ring";
-};
+export declare const focusRing = "focus-visible:outline-1 focus-visible:outline-solid focus-visible:outline-border-focus focus-visible:outline-offset-0";
+export declare const focusRingInset = "focus-visible:outline-1 focus-visible:outline-solid focus-visible:outline-border-focus focus-visible:-outline-offset-1";
+export declare const focusRingOffset = "focus-visible:outline-1 focus-visible:outline-solid focus-visible:outline-border-focus focus-visible:outline-offset-2";
 export type TransitionPreset = keyof typeof transitions;
 export type HoverEffect = keyof typeof hoverEffects;
-export type FocusRingStyle = keyof typeof focusRing;

package/dist/src/ds/tokens/color-foundations.stories.d.ts CHANGED Viewed

@@ -12,9 +12,10 @@ declare const meta: {
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const ColorFoundations: Story;
-export declare const SemanticColors: Story;
-export declare const ProductColors: Story;
+export declare const Monochrome: Story;
+export declare const Chromatic: Story;
+export declare const Semantic: Story;
+export declare const Products: Story;
 export declare const Charts: Story;
 export declare const SpanTypes: Story;
-export declare const BrandColors: Story;
+export declare const Brand: Story;

package/dist/src/ds/tokens/colors.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ export declare const Colors: {
     'chart-sequential-3': string;
     'chart-sequential-4': string;
     'chart-sequential-5': string;
+    'chart-sequential-pale': string;
     'span-agent': string;
     'span-workflow': string;
     'span-model': string;
@@ -34,8 +35,15 @@ export declare const Colors: {
     'red-800': string;
     'red-900': string;
     'red-950': string;
+    'red-soft-50': string;
+    'red-soft-100': string;
+    'red-soft-200': string;
     'red-soft-300': string;
+    'red-soft-400': string;
+    'red-soft-500': string;
     'red-soft-600': string;
+    'red-soft-700': string;
+    'red-soft-800': string;
     'red-soft-900': string;
     'red-soft-950': string;
     'orange-50': string;
@@ -49,8 +57,15 @@ export declare const Colors: {
     'orange-800': string;
     'orange-900': string;
     'orange-950': string;
+    'orange-soft-50': string;
+    'orange-soft-100': string;
+    'orange-soft-200': string;
     'orange-soft-300': string;
+    'orange-soft-400': string;
+    'orange-soft-500': string;
     'orange-soft-600': string;
+    'orange-soft-700': string;
+    'orange-soft-800': string;
     'orange-soft-900': string;
     'orange-soft-950': string;
     'yellow-50': string;
@@ -64,8 +79,15 @@ export declare const Colors: {
     'yellow-800': string;
     'yellow-900': string;
     'yellow-950': string;
+    'yellow-soft-50': string;
+    'yellow-soft-100': string;
+    'yellow-soft-200': string;
     'yellow-soft-300': string;
+    'yellow-soft-400': string;
+    'yellow-soft-500': string;
     'yellow-soft-600': string;
+    'yellow-soft-700': string;
+    'yellow-soft-800': string;
     'yellow-soft-900': string;
     'yellow-soft-950': string;
     'cyan-50': string;
@@ -79,8 +101,15 @@ export declare const Colors: {
     'cyan-800': string;
     'cyan-900': string;
     'cyan-950': string;
+    'cyan-soft-50': string;
+    'cyan-soft-100': string;
+    'cyan-soft-200': string;
     'cyan-soft-300': string;
+    'cyan-soft-400': string;
+    'cyan-soft-500': string;
     'cyan-soft-600': string;
+    'cyan-soft-700': string;
+    'cyan-soft-800': string;
     'cyan-soft-900': string;
     'cyan-soft-950': string;
     'blue-50': string;
@@ -94,8 +123,15 @@ export declare const Colors: {
     'blue-800': string;
     'blue-900': string;
     'blue-950': string;
+    'blue-soft-50': string;
+    'blue-soft-100': string;
+    'blue-soft-200': string;
     'blue-soft-300': string;
+    'blue-soft-400': string;
+    'blue-soft-500': string;
     'blue-soft-600': string;
+    'blue-soft-700': string;
+    'blue-soft-800': string;
     'blue-soft-900': string;
     'blue-soft-950': string;
     'purple-50': string;
@@ -109,8 +145,15 @@ export declare const Colors: {
     'purple-800': string;
     'purple-900': string;
     'purple-950': string;
+    'purple-soft-50': string;
+    'purple-soft-100': string;
+    'purple-soft-200': string;
     'purple-soft-300': string;
+    'purple-soft-400': string;
+    'purple-soft-500': string;
     'purple-soft-600': string;
+    'purple-soft-700': string;
+    'purple-soft-800': string;
     'purple-soft-900': string;
     'purple-soft-950': string;
     'pink-50': string;
@@ -124,8 +167,15 @@ export declare const Colors: {
     'pink-800': string;
     'pink-900': string;
     'pink-950': string;
+    'pink-soft-50': string;
+    'pink-soft-100': string;
+    'pink-soft-200': string;
     'pink-soft-300': string;
+    'pink-soft-400': string;
+    'pink-soft-500': string;
     'pink-soft-600': string;
+    'pink-soft-700': string;
+    'pink-soft-800': string;
     'pink-soft-900': string;
     'pink-soft-950': string;
     'badge-green-indicator': string;
@@ -137,6 +187,7 @@ export declare const Colors: {
     'badge-yellow-indicator': string;
     'badge-yellow-foreground': string;
     'brand-green': string;
+    'brand-green-indicator': string;
     'brand-orange': string;
     'brand-pink': string;
     'brand-purple': string;
@@ -147,18 +198,22 @@ export declare const Colors: {
     'destructive-subtle-active': string;
     'destructive-edge': string;
     'destructive-indicator': string;
+    'destructive-bright': string;
     'destructive-subtle-foreground': string;
     'warning-subtle': string;
     'warning-edge': string;
     'warning-indicator': string;
+    'warning-bright': string;
     'warning-subtle-foreground': string;
     'success-subtle': string;
     'success-edge': string;
     'success-indicator': string;
+    'success-bright': string;
     'success-subtle-foreground': string;
     'info-subtle': string;
     'info-edge': string;
     'info-indicator': string;
+    'info-bright': string;
     'info-subtle-foreground': string;
     'product-studio': string;
     'product-studio-foreground': string;
@@ -206,7 +261,6 @@ export declare const Colors: {
     foreground: string;
     'muted-foreground': string;
     placeholder: string;
-    ring: string;
     scrim: string;
     'badge-green-strong': string;
     'badge-green-subtle': string;
@@ -252,8 +306,15 @@ export declare const Colors: {
     'green-800': string;
     'green-900': string;
     'green-950': string;
+    'green-soft-50': string;
+    'green-soft-100': string;
+    'green-soft-200': string;
     'green-soft-300': string;
+    'green-soft-400': string;
+    'green-soft-500': string;
     'green-soft-600': string;
+    'green-soft-700': string;
+    'green-soft-800': string;
     'green-soft-900': string;
     'green-soft-950': string;
 };

package/dist/src/ds/tokens/foundations-layout.d.ts CHANGED Viewed

@@ -12,7 +12,6 @@ export declare const FoundationPage: ({ eyebrow, title, description, aside, note
 interface FoundationSectionProps {
     label: string;
     description: string;
-    /** `sidebar` bleeds the section to the page edges and repaints it, so a rung can be read on a second surface. */
     surface?: 'canvas' | 'sidebar';
     children: ReactNode;
 }

package/dist/src/ds/tokens/shadows.d.ts CHANGED Viewed

@@ -2,5 +2,4 @@ export declare const Shadows: {
     raised: string;
     overlay: string;
     input: string;
-    'focus-ring': string;
 };