@alpic-ai/ui 0.0.0-staging.gfabea7f → 0.0.0-staging.gfcc71e5

package/dist/components/alert.d.mts

@@ -2,7 +2,7 @@ import { VariantProps } from "class-variance-authority";
 import * as React$1 from "react";
 //#region src/components/alert.d.ts
 declare const alertVariants: (props?: ({
-  variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
+  variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {}
 declare function Alert({ className, variant, ...props }: AlertProps): React$1.JSX.Element;

package/dist/components/avatar.d.mts

@@ -3,7 +3,7 @@ import * as React$1 from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 //#region src/components/avatar.d.ts
 declare const avatarVariants: (props?: ({
-  size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+  size?: "sm" | "md" | "lg" | "xs" | "xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type AvatarSize = NonNullable<VariantProps<typeof avatarVariants>["size"]>;
 type AvatarStatus = "online";

package/dist/components/badge.d.mts

@@ -1,7 +1,7 @@
 import { VariantProps } from "class-variance-authority";
 //#region src/components/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "warning" | "success" | "secondary" | "primary" | "error" | null | undefined;
+  variant?: "success" | "warning" | "primary" | "secondary" | "error" | null | undefined;
   size?: "sm" | "md" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}

package/dist/components/bar-chart.mjs

@@ -89,7 +89,7 @@ function BarChart({ data, index, series, variant = "stacked", legend = false, le
 		"data-slot": "bar-chart",
 		className: cn("flex w-full flex-col gap-3", "[&_.recharts-surface]:outline-none [&_.recharts-wrapper]:outline-none", className),
 		children: [/* @__PURE__ */ jsx("div", {
-			className: "w-full",
+			className: cn("w-full", bare && !loading && !isEmpty && "border-border border-b"),
 			style: { height },
 			children: loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-full w-full rounded-lg" }) : isEmpty ? /* @__PURE__ */ jsx("div", {
 				className: "flex h-full items-center justify-center rounded-lg border border-border border-dashed font-mono text-quaternary-foreground text-text-xs",

package/dist/components/bar-list.mjs

@@ -19,7 +19,6 @@ const SECONDARY_BADGE_VARIANT = {
 };
 const PLACEHOLDER_HEIGHT = 168;
 const RAMP_CEILING = .8;
-const SEMANTIC_FLOOR = .62;
 const IN_FILL_SHADOW = "0 1px 2px rgb(0 0 0 / 0.28)";
 const ROW_INTERACTIVE_CLASS = "rounded-md text-left outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-card";
 function BarList({ data, index, dataKey = "value", secondaryKey, secondaryVariantKey, titleKey, maxItems, palette, semantic, loading = false, valueFormatter = (value) => value.toLocaleString("en-US"), labelFormatter, className }) {
@@ -39,7 +38,7 @@ function BarList({ data, index, dataKey = "value", secondaryKey, secondaryVarian
 		const capped = maxItems ? mapped.slice(0, maxItems) : mapped;
 		return capped.map((row, rank) => {
 			const rankFraction = capped.length > 1 ? rank / (capped.length - 1) : 0;
-			const accentWeight = Math.round((1 - rankFraction * (1 - SEMANTIC_FLOOR)) * 100);
+			const accentWeight = Math.round((1 - rankFraction * .38) * 100);
 			return {
 				...row,
 				color: accent ? `color-mix(in oklab, ${accent} ${accentWeight}%, white)` : rampColor(paletteName, rankFraction * RAMP_CEILING)

package/dist/components/breadcrumb.mjs

@@ -29,7 +29,7 @@ function BreadcrumbItem({ className, ...props }) {
 function BreadcrumbLink({ asChild, className, ...props }) {
 	return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
 		"data-slot": "breadcrumb-link",
-		className: cn("type-text-sm font-medium text-subtle-foreground transition-colors [@media(hover:hover)]:hover:text-muted-foreground", className),
+		className: cn("type-text-sm font-medium text-subtle-foreground transition-colors [@media(hover:hover)]:hover:text-muted-foreground", "inline-flex items-center max-md:min-h-11", className),
 		...props
 	});
 }

package/dist/components/button.d.mts

@@ -2,8 +2,8 @@ import { VariantProps } from "class-variance-authority";
 import * as React$1 from "react";
 //#region src/components/button.d.ts
 declare const buttonVariants: (props?: ({
-  variant?: "destructive" | "secondary" | "primary" | "tertiary" | "link" | "link-muted" | "cta" | null | undefined;
-  size?: "default" | "icon" | "icon-rounded" | "pill" | null | undefined;
+  variant?: "destructive" | "link" | "primary" | "secondary" | "tertiary" | "link-muted" | "cta" | null | undefined;
+  size?: "default" | "pill" | "icon" | "icon-rounded" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface ButtonProps extends React$1.ComponentProps<"button">, VariantProps<typeof buttonVariants> {
   asChild?: boolean;

package/dist/components/button.mjs

@@ -8,6 +8,7 @@ import { Slot, Slottable } from "@radix-ui/react-slot";
 const buttonVariants = cva([
 	"inline-flex items-center justify-center gap-1 whitespace-nowrap",
 	"h-8 px-2 rounded-md",
+	"max-md:min-h-11",
 	"font-medium",
 	"transition-colors",
 	"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
@@ -24,13 +25,13 @@ const buttonVariants = cva([
 				"focus-visible:bg-background"
 			].join(" "),
 			link: [
-				"h-auto px-0 rounded-xs underline-offset-4",
+				"h-auto max-md:min-h-0 px-0 rounded-xs underline-offset-4",
 				"text-link",
 				"[@media(hover:hover)]:hover:underline",
 				"focus-visible:bg-background"
 			].join(" "),
 			"link-muted": [
-				"h-auto px-0 rounded-xs underline-offset-4",
+				"h-auto max-md:min-h-0 px-0 rounded-xs underline-offset-4",
 				"text-link-muted",
 				"[@media(hover:hover)]:hover:underline",
 				"focus-visible:bg-background"
@@ -46,8 +47,8 @@ const buttonVariants = cva([
 		},
 		size: {
 			default: "type-text-sm",
-			icon: "size-8 p-0 type-text-sm",
-			"icon-rounded": "size-8 p-0 rounded-full type-text-sm",
+			icon: "size-8 max-md:min-w-11 p-0 type-text-sm",
+			"icon-rounded": "size-8 max-md:min-w-11 p-0 rounded-full type-text-sm",
 			pill: "h-7 px-3 rounded-full type-text-xs"
 		}
 	},

package/dist/components/dialog.mjs

@@ -52,7 +52,7 @@ function DialogContent({ className, children, size, showCloseButton = true, ...p
 		...props,
 		children: [children, showCloseButton && /* @__PURE__ */ jsxs(DialogPrimitive.Close, {
 			"data-slot": "dialog-close",
-			className: cn("absolute top-3 right-4 flex size-8 items-center justify-center rounded-md", "text-subtle-foreground transition-colors", "[@media(hover:hover)]:hover:text-foreground", "focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none", "disabled:pointer-events-none"),
+			className: cn("absolute top-3 right-4 flex size-8 items-center justify-center rounded-md", "max-md:before:absolute max-md:before:top-1/2 max-md:before:left-1/2 max-md:before:size-11 max-md:before:-translate-x-1/2 max-md:before:-translate-y-1/2 max-md:before:content-['']", "text-subtle-foreground transition-colors", "[@media(hover:hover)]:hover:text-foreground", "focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none", "disabled:pointer-events-none"),
 			children: [/* @__PURE__ */ jsx(XIcon, { className: "size-4" }), /* @__PURE__ */ jsx("span", {
 				className: "sr-only",
 				children: "Close"

package/dist/components/dropdown-menu.mjs

@@ -39,6 +39,7 @@ function DropdownMenuGroup({ ...props }) {
 }
 const dropdownMenuItemVariants = cva([
 	"relative flex cursor-default items-center gap-2 rounded-sm px-2.5 py-2 outline-hidden select-none",
+	"max-md:min-h-11",
 	"type-text-sm font-semibold",
 	"mx-1.5 my-px",
 	"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",

package/dist/components/editable.d.mts

@@ -0,0 +1,101 @@
+import * as React$1 from "react";
+//#region src/components/editable.d.ts
+type Direction = "ltr" | "rtl";
+interface DivProps extends React$1.ComponentProps<"div"> {
+  asChild?: boolean;
+}
+interface StoreState {
+  value: string;
+  editing: boolean;
+}
+interface Store {
+  subscribe: (callback: () => void) => () => void;
+  getState: () => StoreState;
+  setState: <K extends keyof StoreState>(key: K, value: StoreState[K]) => void;
+  notify: () => void;
+}
+declare function useStore<T>(selector: (state: StoreState) => T, ogStore?: Store | null): T;
+interface EditableContextValue {
+  rootId: string;
+  inputId: string;
+  labelId: string;
+  defaultValue: string;
+  onCancel: () => void;
+  onEdit: () => void;
+  onSubmit: (value: string) => void;
+  onEnterKeyDown?: (event: KeyboardEvent) => void;
+  onEscapeKeyDown?: (event: KeyboardEvent) => void;
+  dir?: Direction;
+  maxLength?: number;
+  placeholder?: string;
+  triggerMode: "click" | "dblclick" | "focus";
+  autosize: boolean;
+  multiline: boolean;
+  disabled?: boolean;
+  readOnly?: boolean;
+  required?: boolean;
+  invalid?: boolean;
+}
+interface EditableProps extends Omit<DivProps, "onSubmit"> {
+  id?: string;
+  defaultValue?: string;
+  value?: string;
+  onValueChange?: (value: string) => void;
+  defaultEditing?: boolean;
+  editing?: boolean;
+  onEditingChange?: (editing: boolean) => void;
+  onCancel?: () => void;
+  onEdit?: () => void;
+  onSubmit?: (value: string) => void;
+  onEscapeKeyDown?: (event: KeyboardEvent) => void;
+  onEnterKeyDown?: (event: KeyboardEvent) => void;
+  dir?: Direction;
+  maxLength?: number;
+  name?: string;
+  placeholder?: string;
+  triggerMode?: EditableContextValue["triggerMode"];
+  autosize?: boolean;
+  multiline?: boolean;
+  disabled?: boolean;
+  readOnly?: boolean;
+  required?: boolean;
+  invalid?: boolean;
+}
+declare function Editable(props: EditableProps): React$1.JSX.Element;
+interface EditableLabelProps extends React$1.ComponentProps<"label"> {
+  asChild?: boolean;
+}
+declare function EditableLabel(props: EditableLabelProps): React$1.JSX.Element;
+interface EditableAreaProps extends React$1.ComponentProps<"div"> {
+  asChild?: boolean;
+}
+declare function EditableArea(props: EditableAreaProps): React$1.JSX.Element;
+interface EditablePreviewProps extends React$1.ComponentProps<"div"> {
+  asChild?: boolean;
+}
+declare function EditablePreview(props: EditablePreviewProps): React$1.JSX.Element | null;
+interface EditableInputProps extends React$1.ComponentProps<"input"> {
+  asChild?: boolean;
+  maxLength?: number;
+}
+declare function EditableInput(props: EditableInputProps): React$1.JSX.Element | null;
+interface EditableTriggerProps extends React$1.ComponentProps<"button"> {
+  asChild?: boolean;
+  forceMount?: boolean;
+}
+declare function EditableTrigger(props: EditableTriggerProps): React$1.JSX.Element | null;
+interface EditableToolbarProps extends React$1.ComponentProps<"div"> {
+  asChild?: boolean;
+  orientation?: "horizontal" | "vertical";
+}
+declare function EditableToolbar(props: EditableToolbarProps): React$1.JSX.Element;
+interface EditableCancelProps extends React$1.ComponentProps<"button"> {
+  asChild?: boolean;
+}
+declare function EditableCancel(props: EditableCancelProps): React$1.JSX.Element | null;
+interface EditableSubmitProps extends React$1.ComponentProps<"button"> {
+  asChild?: boolean;
+}
+declare function EditableSubmit(props: EditableSubmitProps): React$1.JSX.Element | null;
+//#endregion
+export { Editable, EditableArea, EditableCancel, EditableInput, EditableLabel, EditablePreview, type EditableProps, EditableSubmit, EditableToolbar, EditableTrigger, useStore as useEditable };