@ablehi/automation-app-ui 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,140 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { ReactNode, ComponentProps, ReactElement } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import { Button } from '@base-ui/react/button';
+
+interface AutomationAppPortalProviderProps {
+    children: ReactNode;
+    overlayRoot: HTMLElement;
+}
+declare function AutomationAppPortalProvider({ children, overlayRoot, }: AutomationAppPortalProviderProps): react_jsx_runtime.JSX.Element;
+declare function useAutomationAppOverlayRoot(): HTMLElement;
+
+declare const stackVariants: (props?: ({
+    align?: "start" | "center" | "end" | "stretch" | null | undefined;
+    direction?: "horizontal" | "vertical" | null | undefined;
+    gap?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const gridVariants: (props?: ({
+    columns?: 1 | 2 | 3 | 4 | null | undefined;
+    gap?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function AutomationAppLayout({ className, ...props }: ComponentProps<"main">): react_jsx_runtime.JSX.Element;
+interface AutomationAppHeaderProps extends Omit<ComponentProps<"header">, "title"> {
+    actions?: ReactNode;
+    description?: ReactNode;
+    title: ReactNode;
+}
+declare function AutomationAppHeader({ actions, children, className, description, title, ...props }: AutomationAppHeaderProps): react_jsx_runtime.JSX.Element;
+interface AutomationAppSectionProps extends Omit<ComponentProps<"section">, "title"> {
+    actions?: ReactNode;
+    description?: ReactNode;
+    title?: ReactNode;
+}
+declare function AutomationAppSection({ actions, children, className, description, title, ...props }: AutomationAppSectionProps): react_jsx_runtime.JSX.Element;
+declare function AutomationAppStack({ align, className, direction, gap, ...props }: ComponentProps<"div"> & VariantProps<typeof stackVariants>): react_jsx_runtime.JSX.Element;
+declare function AutomationAppGrid({ className, columns, gap, ...props }: ComponentProps<"div"> & VariantProps<typeof gridVariants>): react_jsx_runtime.JSX.Element;
+
+declare const buttonVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    variant?: "primary" | "secondary" | "ghost" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AutomationAppFieldProps extends ComponentProps<"div"> {
+    children: ReactElement;
+    description?: ReactNode;
+    disabled?: boolean;
+    error?: ReactNode;
+    label: ReactNode;
+    required?: boolean;
+}
+declare function AutomationAppField({ children, className, description, disabled, error, label, required, ...props }: AutomationAppFieldProps): react_jsx_runtime.JSX.Element;
+declare function AutomationAppButton({ className, size, variant, ...props }: Button.Props & VariantProps<typeof buttonVariants>): react_jsx_runtime.JSX.Element;
+declare function AutomationAppInput({ className, ...props }: ComponentProps<"input">): react_jsx_runtime.JSX.Element;
+declare function AutomationAppTextarea({ className, ...props }: ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
+interface AutomationAppSelectOption {
+    disabled?: boolean;
+    label: ReactNode;
+    textValue?: string;
+    value: string;
+}
+interface AutomationAppSelectProps {
+    "aria-describedby"?: string;
+    "aria-invalid"?: boolean | "false" | "true";
+    className?: string;
+    defaultValue?: string | null;
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    onValueChange?: (value: string | null) => void;
+    options: readonly AutomationAppSelectOption[];
+    placeholder?: ReactNode;
+    required?: boolean;
+    value?: string | null;
+}
+declare function AutomationAppSelect({ className, defaultValue, disabled, id, name, onValueChange, options, placeholder, required, value, ...triggerProps }: AutomationAppSelectProps): react_jsx_runtime.JSX.Element;
+
+interface AutomationAppDialogProps {
+    children: ReactNode;
+    className?: string;
+    closeLabel?: string;
+    defaultOpen?: boolean;
+    description?: ReactNode;
+    footer?: ReactNode;
+    onOpenChange?: (open: boolean) => void;
+    open?: boolean;
+    title: ReactNode;
+    trigger: ReactElement;
+}
+declare function AutomationAppDialog({ children, className, closeLabel, defaultOpen, description, footer, onOpenChange, open, title, trigger, }: AutomationAppDialogProps): react_jsx_runtime.JSX.Element;
+interface AutomationAppPopoverProps {
+    children: ReactNode;
+    className?: string;
+    defaultOpen?: boolean;
+    description?: ReactNode;
+    onOpenChange?: (open: boolean) => void;
+    open?: boolean;
+    title?: ReactNode;
+    trigger: ReactElement;
+}
+declare function AutomationAppPopover({ children, className, defaultOpen, description, onOpenChange, open, title, trigger, }: AutomationAppPopoverProps): react_jsx_runtime.JSX.Element;
+interface AutomationAppTooltipProps {
+    children: ReactElement;
+    content: ReactNode;
+    delay?: number;
+    disabled?: boolean;
+    side?: "bottom" | "left" | "right" | "top";
+}
+declare function AutomationAppTooltip({ children, content, delay, disabled, side, }: AutomationAppTooltipProps): react_jsx_runtime.JSX.Element;
+declare const toastVariants: (props?: ({
+    intent?: "error" | "info" | "success" | "warning" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AutomationAppToastProps extends VariantProps<typeof toastVariants> {
+    action?: ReactNode;
+    className?: string;
+    closeLabel?: string;
+    description?: ReactNode;
+    onClose?: () => void;
+    open?: boolean;
+    title: ReactNode;
+}
+declare function AutomationAppToast({ action, className, closeLabel, description, intent, onClose, open, title, }: AutomationAppToastProps): react.ReactPortal | null;
+
+declare const statusVariants: (props?: ({
+    intent?: "error" | "info" | "success" | "warning" | "neutral" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function AutomationAppStatus({ className, intent, ...props }: ComponentProps<"span"> & VariantProps<typeof statusVariants>): react_jsx_runtime.JSX.Element;
+interface AutomationAppStateProps extends Omit<ComponentProps<"div">, "title"> {
+    action?: ReactNode;
+    description?: ReactNode;
+    title: ReactNode;
+}
+declare function AutomationAppLoadingState({ "aria-live": ariaLive, title, ...props }: AutomationAppStateProps): react_jsx_runtime.JSX.Element;
+declare function AutomationAppEmptyState(props: AutomationAppStateProps): react_jsx_runtime.JSX.Element;
+interface AutomationAppErrorStateProps extends AutomationAppStateProps {
+    severity?: "error" | "warning";
+}
+declare function AutomationAppErrorState({ severity, ...props }: AutomationAppErrorStateProps): react_jsx_runtime.JSX.Element;
+
+export { AutomationAppButton, AutomationAppDialog, AutomationAppEmptyState, AutomationAppErrorState, AutomationAppField, AutomationAppGrid, AutomationAppHeader, AutomationAppInput, AutomationAppLayout, AutomationAppLoadingState, AutomationAppPopover, AutomationAppPortalProvider, AutomationAppSection, AutomationAppSelect, AutomationAppStack, AutomationAppStatus, AutomationAppTextarea, AutomationAppToast, AutomationAppTooltip, useAutomationAppOverlayRoot };

package/dist/index.js

@@ -0,0 +1 @@
+import{Tooltip as D}from"@base-ui/react/tooltip";import{createContext as k,useContext as w}from"react";import{jsx as T}from"react/jsx-runtime";var I=k(null);function L({children:a,overlayRoot:t}){if(!t)throw new Error("AutomationAppPortalProvider requires an overlay root");return T(I.Provider,{value:t,children:T(D.Provider,{delay:400,children:a})})}function N(){let a=w(I);if(!a)throw new Error("AutomationAppPortalProvider is required");return a}import{cva as x}from"class-variance-authority";import{clsx as F}from"clsx";import{twMerge as B}from"tailwind-merge";function s(...a){return B(F(a))}import{jsx as f,jsxs as y}from"react/jsx-runtime";var H=x("aaui-stack",{variants:{align:{start:"aaui-stack--align-start",center:"aaui-stack--align-center",end:"aaui-stack--align-end",stretch:"aaui-stack--align-stretch"},direction:{horizontal:"aaui-stack--horizontal",vertical:"aaui-stack--vertical"},gap:{sm:"aaui-gap-sm",md:"aaui-gap-md",lg:"aaui-gap-lg"}},defaultVariants:{align:"stretch",direction:"vertical",gap:"md"}}),z=x("aaui-grid",{variants:{columns:{1:"aaui-grid--1",2:"aaui-grid--2",3:"aaui-grid--3",4:"aaui-grid--4"},gap:{sm:"aaui-gap-sm",md:"aaui-gap-md",lg:"aaui-gap-lg"}},defaultVariants:{columns:1,gap:"md"}});function M({className:a,...t}){return f("main",{className:s("aaui-layout",a),...t})}function $({actions:a,children:t,className:o,description:e,title:i,...r}){return y("header",{className:s("aaui-header",o),...r,children:[y("div",{className:"aaui-header__copy",children:[f("h1",{className:"aaui-header__title",children:i}),e?f("div",{className:"aaui-header__description",children:e}):null]}),a?f("div",{className:"aaui-header__actions",children:a}):null,t]})}function q({actions:a,children:t,className:o,description:e,title:i,...r}){return y("section",{className:s("aaui-section",o),...r,children:[i||e||a?y("div",{className:"aaui-section__header",children:[y("div",{className:"aaui-section__copy",children:[i?f("h2",{className:"aaui-section__title",children:i}):null,e?f("div",{className:"aaui-section__description",children:e}):null]}),a?f("div",{className:"aaui-section__actions",children:a}):null]}):null,t]})}function G({align:a,className:t,direction:o,gap:e,...i}){return f("div",{className:s(H({align:a,direction:o,gap:e}),t),...i})}function X({className:a,columns:t,gap:o,...e}){return f("div",{className:s(z({columns:t,gap:o}),a),...e})}import{Button as W}from"@base-ui/react/button";import{Input as J}from"@base-ui/react/input";import{Select as c}from"@base-ui/react/select";import{cva as K}from"class-variance-authority";import{CheckIcon as Q,ChevronDownIcon as U}from"lucide-react";import{cloneElement as Y,isValidElement as Z,useId as j}from"react";import{jsx as l,jsxs as h}from"react/jsx-runtime";var aa=K("aaui-button",{variants:{size:{sm:"aaui-button--sm",md:"aaui-button--md",lg:"aaui-button--lg"},variant:{primary:"aaui-button--primary",secondary:"aaui-button--secondary",ghost:"aaui-button--ghost",destructive:"aaui-button--destructive"}},defaultVariants:{size:"md",variant:"primary"}});function ta({children:a,className:t,description:o,disabled:e,error:i,label:r,required:p,...A}){let v=j(),g=a.props,P=g.id??`aaui-field-${v}`,R=o?`${P}-description`:void 0,V=i?`${P}-error`:void 0,u=[g["aria-describedby"],R,V].filter(Boolean).join(" ")||void 0,E=Z(a)?Y(a,{"aria-describedby":u,...i?{"aria-invalid":!0}:{},...e===void 0?{}:{disabled:e},id:P,...p===void 0?{}:{required:p}}):a;return h("div",{className:s("aaui-field",t),"data-disabled":e||void 0,"data-invalid":!!i||void 0,...A,children:[h("label",{className:"aaui-field__label",htmlFor:P,children:[r,p?l("span",{"aria-hidden":"true",children:" *"}):null]}),E,o?l("div",{className:"aaui-field__description",id:R,children:o}):null,i?l("div",{className:"aaui-field__error",id:V,role:"alert",children:i}):null]})}function oa({className:a,size:t,variant:o,...e}){return l(W,{className:s(aa({size:t,variant:o}),a),...e})}function ea({className:a,...t}){return l(J,{className:s("aaui-input",a),...t})}function ia({className:a,...t}){return l("textarea",{className:s("aaui-textarea",a),...t})}function na({className:a,defaultValue:t,disabled:o,id:e,name:i,onValueChange:r,options:p,placeholder:A,required:v,value:g,...P}){let R=N(),V=p.map(u=>({label:u.label,value:u.value}));return h(c.Root,{defaultValue:t,disabled:o,id:e,items:V,name:i,onValueChange:u=>r?.(u),required:v,value:g,children:[h(c.Trigger,{className:s("aaui-select__trigger",a),...P,children:[l(c.Value,{placeholder:A}),l(c.Icon,{className:"aaui-select__icon",children:l(U,{"aria-hidden":"true"})})]}),l(c.Portal,{container:R,children:l(c.Positioner,{alignItemWithTrigger:!1,className:"aaui-select__positioner",sideOffset:4,children:l(c.Popup,{className:"aaui-select__popup",children:l(c.List,{className:"aaui-select__list",children:p.map(u=>h(c.Item,{className:"aaui-select__item",disabled:u.disabled,label:u.textValue,value:u.value,children:[l(c.ItemText,{children:u.label}),l(c.ItemIndicator,{className:"aaui-select__indicator",children:l(Q,{"aria-hidden":"true"})})]},u.value))})})})})]})}import{Dialog as _}from"@base-ui/react/dialog";import{Popover as b}from"@base-ui/react/popover";import{Tooltip as S}from"@base-ui/react/tooltip";import{cva as ra}from"class-variance-authority";import{XIcon as O}from"lucide-react";import{createPortal as sa}from"react-dom";import{jsx as n,jsxs as m}from"react/jsx-runtime";function la({children:a,className:t,closeLabel:o="Close",defaultOpen:e,description:i,footer:r,onOpenChange:p,open:A,title:v,trigger:g}){let P=N();return m(_.Root,{defaultOpen:e,onOpenChange:R=>p?.(R),open:A,children:[n(_.Trigger,{render:g}),m(_.Portal,{container:P,children:[n(_.Backdrop,{className:"aaui-dialog__backdrop"}),m(_.Popup,{className:s("aaui-dialog",t),children:[m("div",{className:"aaui-dialog__header",children:[m("div",{className:"aaui-dialog__copy",children:[n(_.Title,{className:"aaui-dialog__title",children:v}),i?n(_.Description,{className:"aaui-dialog__description",children:i}):null]}),n(_.Close,{className:"aaui-icon-button","aria-label":o,children:n(O,{"aria-hidden":"true"})})]}),n("div",{className:"aaui-dialog__content",children:a}),r?n("div",{className:"aaui-dialog__footer",children:r}):null]})]})]})}function pa({children:a,className:t,defaultOpen:o,description:e,onOpenChange:i,open:r,title:p,trigger:A}){let v=N();return m(b.Root,{defaultOpen:o,onOpenChange:g=>i?.(g),open:r,children:[n(b.Trigger,{render:A}),n(b.Portal,{container:v,children:n(b.Positioner,{align:"start",sideOffset:6,children:m(b.Popup,{className:s("aaui-popover",t),children:[p?n(b.Title,{className:"aaui-popover__title",children:p}):null,e?n(b.Description,{className:"aaui-popover__description",children:e}):null,a]})})})]})}function ua({children:a,content:t,delay:o,disabled:e,side:i="top"}){let r=N();return m(S.Root,{disabled:e,children:[n(S.Trigger,{delay:o,render:a}),n(S.Portal,{container:r,children:n(S.Positioner,{side:i,sideOffset:4,children:n(S.Popup,{className:"aaui-tooltip",children:t})})})]})}var ca=ra("aaui-toast",{variants:{intent:{info:"aaui-toast--info",success:"aaui-toast--success",warning:"aaui-toast--warning",error:"aaui-toast--error"}},defaultVariants:{intent:"info"}});function da({action:a,className:t,closeLabel:o="Dismiss",description:e,intent:i,onClose:r,open:p=!0,title:A}){let v=N();return p?sa(m("div",{"aria-atomic":"true",className:s(ca({intent:i}),t),role:i==="error"?"alert":"status",children:[m("div",{className:"aaui-toast__copy",children:[n("div",{className:"aaui-toast__title",children:A}),e?n("div",{className:"aaui-toast__description",children:e}):null]}),a?n("div",{className:"aaui-toast__action",children:a}):null,r?n("button",{"aria-label":o,className:"aaui-icon-button",onClick:r,type:"button",children:n(O,{"aria-hidden":"true"})}):null]}),v):null}import{cva as ma}from"class-variance-authority";import{CircleAlertIcon as Aa,CircleXIcon as va,InfoIcon as fa,Loader2Icon as ga}from"lucide-react";import{jsx as d,jsxs as ya}from"react/jsx-runtime";var Pa=ma("aaui-status",{variants:{intent:{neutral:"aaui-status--neutral",info:"aaui-status--info",success:"aaui-status--success",warning:"aaui-status--warning",error:"aaui-status--error"}},defaultVariants:{intent:"neutral"}});function Na({className:a,intent:t,...o}){return d("span",{className:s(Pa({intent:t}),a),...o})}function C({action:a,children:t,className:o,description:e,title:i,...r}){return ya("div",{className:s("aaui-state",o),...r,children:[d("div",{className:"aaui-state__icon",children:t}),d("div",{className:"aaui-state__title",children:i}),e?d("div",{className:"aaui-state__description",children:e}):null,a?d("div",{className:"aaui-state__action",children:a}):null]})}function _a({"aria-live":a="polite",title:t,...o}){return d(C,{"aria-live":a,title:t,...o,children:d(ga,{"aria-hidden":"true",className:"aaui-spin"})})}function ba(a){return d(C,{...a,children:d(fa,{"aria-hidden":"true"})})}function Ra({severity:a="error",...t}){let o=a==="warning"?Aa:va;return d(C,{className:`aaui-state--${a}`,role:"alert",...t,children:d(o,{"aria-hidden":"true"})})}export{oa as AutomationAppButton,la as AutomationAppDialog,ba as AutomationAppEmptyState,Ra as AutomationAppErrorState,ta as AutomationAppField,X as AutomationAppGrid,$ as AutomationAppHeader,ea as AutomationAppInput,M as AutomationAppLayout,_a as AutomationAppLoadingState,pa as AutomationAppPopover,L as AutomationAppPortalProvider,q as AutomationAppSection,na as AutomationAppSelect,G as AutomationAppStack,Na as AutomationAppStatus,ia as AutomationAppTextarea,da as AutomationAppToast,ua as AutomationAppTooltip,N as useAutomationAppOverlayRoot};

package/dist/styles.css

@@ -0,0 +1 @@
+@layer components{.aaui-layout,.aaui-dialog,.aaui-popover,.aaui-tooltip,.aaui-toast,.aaui-select__popup{color:var(--foreground, oklch(.21 .006 285.885));font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif)}.aaui-layout{box-sizing:border-box;display:flex;min-width:0;width:100%;flex-direction:column;gap:1.5rem}.aaui-header,.aaui-section__header{display:flex;min-width:0;align-items:flex-start;justify-content:space-between;gap:1rem}.aaui-header__copy,.aaui-section__copy{min-width:0}.aaui-header__title,.aaui-section__title{margin:0;color:var(--foreground);font-weight:600;line-height:1.25}.aaui-header__title{font-size:1.5rem}.aaui-section__title{font-size:1rem}.aaui-header__description,.aaui-section__description,.aaui-dialog__description,.aaui-popover__description,.aaui-toast__description,.aaui-state__description,.aaui-field__description{margin-top:.25rem;color:var(--muted-foreground, oklch(.55 .016 285.938));font-size:.875rem;line-height:1.45}.aaui-header__actions,.aaui-section__actions,.aaui-dialog__footer,.aaui-toast__action,.aaui-state__action{display:flex;align-items:center;gap:.5rem}.aaui-section{box-sizing:border-box;display:flex;min-width:0;flex-direction:column;gap:1rem;border:1px solid var(--border, oklch(.92 .004 286.32));border-radius:var(--radius, .75rem);background:var(--card, var(--background, white));padding:1rem}.aaui-stack{display:flex;min-width:0}.aaui-stack--vertical{flex-direction:column}.aaui-stack--horizontal{flex-direction:row}.aaui-stack--align-start{align-items:flex-start}.aaui-stack--align-center{align-items:center}.aaui-stack--align-end{align-items:flex-end}.aaui-stack--align-stretch{align-items:stretch}.aaui-grid{display:grid;min-width:0}.aaui-grid--1{grid-template-columns:minmax(0,1fr)}.aaui-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.aaui-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.aaui-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}.aaui-gap-sm{gap:.5rem}.aaui-gap-md{gap:1rem}.aaui-gap-lg{gap:1.5rem}.aaui-field{display:flex;min-width:0;flex-direction:column;gap:.375rem}.aaui-field__label{color:var(--foreground);font-size:.875rem;font-weight:500}.aaui-field__error{color:var(--destructive, oklch(.58 .22 27.325));font-size:.875rem}.aaui-field[data-disabled]{opacity:.6}.aaui-button,.aaui-icon-button,.aaui-select__trigger{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:calc(var(--radius, .75rem) - .125rem);font:inherit;font-size:.875rem;font-weight:500;outline:none;transition:background-color .12s ease,border-color .12s ease,color .12s ease,box-shadow .12s ease}.aaui-button:focus-visible,.aaui-icon-button:focus-visible,.aaui-select__trigger:focus-visible,.aaui-input:focus-visible,.aaui-textarea:focus-visible{border-color:var(--ring, var(--primary));box-shadow:0 0 0 3px color-mix(in oklch,var(--ring, var(--primary)) 25%,transparent)}.aaui-button:disabled,.aaui-icon-button:disabled,.aaui-select__trigger:disabled,.aaui-input:disabled,.aaui-textarea:disabled{cursor:not-allowed;opacity:.5}.aaui-button--sm{min-height:1.75rem;padding:.25rem .625rem}.aaui-button--md{min-height:2rem;padding:.375rem .75rem}.aaui-button--lg{min-height:2.5rem;padding:.5rem 1rem}.aaui-button--primary{background:var(--primary, oklch(.21 .006 285.885));color:var(--primary-foreground, white)}.aaui-button--secondary,.aaui-button--ghost{color:var(--foreground)}.aaui-button--secondary{border-color:var(--border);background:var(--secondary, oklch(.967 .001 286.375))}.aaui-button--ghost{background:transparent}.aaui-button--destructive{background:color-mix(in oklch,var(--destructive) 12%,transparent);color:var(--destructive)}.aaui-button:hover:not(:disabled),.aaui-icon-button:hover:not(:disabled),.aaui-select__trigger:hover:not(:disabled){filter:brightness(.96)}.aaui-input,.aaui-textarea,.aaui-select__trigger{box-sizing:border-box;width:100%;border:1px solid var(--input, var(--border));border-radius:calc(var(--radius, .75rem) - .125rem);background:transparent;color:var(--foreground);font:inherit;font-size:.875rem;outline:none}.aaui-input,.aaui-select__trigger{min-height:2rem;padding:.375rem .625rem}.aaui-textarea{min-height:5rem;resize:vertical;padding:.5rem .625rem}.aaui-select__trigger{justify-content:space-between;gap:.5rem}.aaui-select__icon,.aaui-select__indicator,.aaui-icon-button{flex:0 0 auto}.aaui-select__icon svg,.aaui-select__indicator svg,.aaui-icon-button svg,.aaui-state__icon svg{width:1rem;height:1rem}.aaui-select__positioner,.aaui-popover,.aaui-tooltip{z-index:60}.aaui-select__popup,.aaui-popover,.aaui-tooltip,.aaui-toast,.aaui-dialog{box-sizing:border-box;border:1px solid var(--border);border-radius:var(--radius, .75rem);background:var(--popover, var(--background, white));color:var(--popover-foreground, var(--foreground));box-shadow:var(--shadow-lg, 0 12px 32px rgb(0 0 0 / .14))}.aaui-select__popup{min-width:var(--anchor-width);max-height:min(20rem,var(--available-height));overflow:auto;padding:.25rem}.aaui-select__list{outline:none}.aaui-select__item{display:flex;min-height:2rem;cursor:default;align-items:center;justify-content:space-between;gap:.75rem;border-radius:calc(var(--radius, .75rem) - .25rem);padding:.375rem .5rem;font-size:.875rem;outline:none}.aaui-select__item[data-highlighted]{background:var(--accent, var(--muted))}.aaui-select__item[data-disabled]{opacity:.5}.aaui-dialog__backdrop{position:fixed;z-index:70;inset:0;background:#00000059;backdrop-filter:blur(2px)}.aaui-dialog{position:fixed;z-index:71;top:50%;left:50%;display:flex;width:min(32rem,calc(100% - 2rem));max-height:calc(100% - 2rem);transform:translate(-50%,-50%);flex-direction:column;overflow:auto}.aaui-dialog__header,.aaui-toast{display:flex;align-items:flex-start;gap:.75rem}.aaui-dialog__header{justify-content:space-between;padding:1rem 1rem 0}.aaui-dialog__copy,.aaui-toast__copy{min-width:0;flex:1 1 auto}.aaui-dialog__title,.aaui-popover__title,.aaui-toast__title,.aaui-state__title{margin:0;font-size:.9375rem;font-weight:600;line-height:1.35}.aaui-dialog__content{padding:1rem}.aaui-dialog__footer{justify-content:flex-end;border-top:1px solid var(--border);background:color-mix(in oklch,var(--muted) 40%,transparent);padding:.75rem 1rem}.aaui-icon-button{width:2rem;height:2rem;padding:0;background:transparent;color:var(--muted-foreground)}.aaui-popover{max-width:min(22rem,calc(100vw - 2rem));padding:.75rem}.aaui-popover__title+.aaui-popover__description{margin-bottom:.75rem}.aaui-tooltip{max-width:18rem;padding:.375rem .625rem;background:var(--foreground);color:var(--background);font-size:.75rem;line-height:1.35}.aaui-toast{position:absolute;z-index:80;right:1rem;bottom:1rem;width:min(24rem,calc(100% - 2rem));padding:.75rem;border-left-width:.25rem}.aaui-toast--info{border-left-color:var(--primary)}.aaui-toast--success{border-left-color:var(--success, oklch(.58 .16 145))}.aaui-toast--warning{border-left-color:var(--warning, oklch(.68 .16 75))}.aaui-toast--error{border-left-color:var(--destructive)}.aaui-status{display:inline-flex;align-items:center;width:fit-content;border:1px solid currentColor;border-radius:999px;padding:.125rem .5rem;font-size:.75rem;font-weight:500;line-height:1.4}.aaui-status--neutral{color:var(--muted-foreground)}.aaui-status--info{color:var(--primary)}.aaui-status--success{color:var(--success, oklch(.48 .14 145))}.aaui-status--warning{color:var(--warning, oklch(.55 .15 75))}.aaui-status--error,.aaui-state--error{color:var(--destructive)}.aaui-state{display:flex;min-height:10rem;align-items:center;justify-content:center;flex-direction:column;gap:.5rem;border:1px dashed var(--border);border-radius:var(--radius, .75rem);padding:1.5rem;text-align:center}.aaui-state--warning{color:var(--warning, oklch(.55 .15 75))}.aaui-state__description{max-width:28rem}.aaui-spin{animation:aaui-spin .9s linear infinite}}@keyframes aaui-spin{to{transform:rotate(360deg)}}@media(max-width:42rem){.aaui-grid--2,.aaui-grid--3,.aaui-grid--4{grid-template-columns:minmax(0,1fr)}.aaui-header,.aaui-section__header{flex-direction:column}}@media(prefers-reduced-motion:reduce){.aaui-spin{animation-duration:1.8s}}

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@ablehi/automation-app-ui",
+  "version": "0.1.0",
+  "description": "ShadowRoot-safe public UI primitives for Ablehi Automation Apps.",
+  "license": "UNLICENSED",
+  "private": false,
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./styles.css": "./dist/styles.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "./dist/styles.css"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "dependencies": {
+    "@ablehi/automation-app-host-bridge": "0.1.0",
+    "@base-ui/react": "1.6.0",
+    "class-variance-authority": "0.7.1",
+    "clsx": "2.1.1",
+    "lucide-react": "1.16.0",
+    "tailwind-merge": "3.6.0"
+  },
+  "peerDependencies": {
+    "react": "19.2.4",
+    "react-dom": "19.2.4"
+  },
+  "devDependencies": {
+    "@types/react": "19.2.14",
+    "@types/react-dom": "19.2.3",
+    "esbuild": "0.27.7",
+    "eslint": "9.39.2",
+    "jsdom": "27.4.0",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
+    "tsup": "8.5.1",
+    "typescript": "5.9.3",
+    "vitest": "4.1.7"
+  },
+  "scripts": {
+    "build": "tsup && esbuild styles.css --bundle --minify --outfile=dist/styles.css",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "lint": "eslint src --ext .ts,.tsx",
+    "test": "vitest run",
+    "check": "pnpm build && pnpm typecheck && pnpm lint && pnpm test"
+  }
+}