@douglasneuroinformatics/libui 3.1.2 → 3.1.4

package/dist/components.d.ts

@@ -50,7 +50,9 @@ type ActionDropdownOptionKey<T> = T extends readonly string[] ? T[number] : T ex
     [key: string]: string;
 } ? Extract<keyof T, string> : never;
 type ActionDropdownProps<T extends ActionDropdownOptions> = {
+    [key: `data-${string}`]: unknown;
     align?: DropdownMenuContentProps['align'];
+    className?: string;
     contentClassName?: string;
     disabled?: boolean;
     /** Callback function invoked when user clicks an option */
@@ -62,7 +64,7 @@ type ActionDropdownProps<T extends ActionDropdownOptions> = {
     triggerClassName?: string;
     widthFull?: boolean;
 };
-declare function ActionDropdown<const T extends ActionDropdownOptions>({ align, contentClassName, disabled, onSelection, options, title, triggerClassName, widthFull }: ActionDropdownProps<T>): react_jsx_runtime.JSX.Element;
+declare function ActionDropdown<const T extends ActionDropdownOptions>({ align, className, contentClassName, disabled, onSelection, options, title, triggerClassName, widthFull, ...props }: ActionDropdownProps<T>): react_jsx_runtime.JSX.Element;
 
 declare const AlertDialog: React$1.FC<_radix_ui_react_alert_dialog.AlertDialogProps> & {
     Action: React$1.ForwardRefExoticComponent<Omit<_radix_ui_react_alert_dialog.AlertDialogActionProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
@@ -712,6 +714,7 @@ type ClientTableColumnProps<T extends ClientTableEntry> = {
     dropdownOptions?: ClientTableDropdownOptions<T>;
 };
 type ClientTableProps<T extends ClientTableEntry> = {
+    [key: `data-${string}`]: unknown;
     className?: string;
     columnDropdownOptions?: ClientTableDropdownOptions<T>;
     columns: ClientTableColumn<T>[];
@@ -721,7 +724,7 @@ type ClientTableProps<T extends ClientTableEntry> = {
     noWrap?: boolean;
     onEntryClick?: (entry: T) => void;
 };
-declare const ClientTable: <T extends ClientTableEntry>({ className, columnDropdownOptions, columns, data, entriesPerPage, minRows, noWrap, onEntryClick }: ClientTableProps<T>) => react_jsx_runtime.JSX.Element;
+declare const ClientTable: <T extends ClientTableEntry>({ className, columnDropdownOptions, columns, data, entriesPerPage, minRows, noWrap, onEntryClick, ...props }: ClientTableProps<T>) => react_jsx_runtime.JSX.Element;
 
 declare const Collapsible: React$1.ForwardRefExoticComponent<Omit<_radix_ui_react_collapsible.CollapsibleProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>> & {
     Content: React$1.ForwardRefExoticComponent<_radix_ui_react_collapsible.CollapsibleContentProps & React$1.RefAttributes<HTMLDivElement>>;

package/dist/components.js

@@ -280,16 +280,18 @@ var DropdownMenu = Object.assign(DropdownMenuPrimitive9.Root.bind(null), {
 import { jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
 function ActionDropdown({
   align = "start",
+  className,
   contentClassName,
   disabled,
   onSelection,
   options,
   title,
   triggerClassName,
-  widthFull
+  widthFull,
+  ...props
 }) {
   const optionKeys = options instanceof Array ? options : Object.keys(options);
-  return /* @__PURE__ */ jsx15(DropdownMenu, { children: /* @__PURE__ */ jsxs6("div", { className: "w-full", children: [
+  return /* @__PURE__ */ jsx15(DropdownMenu, { children: /* @__PURE__ */ jsxs6("div", { className: cn("w-full", className), ...props, children: [
     /* @__PURE__ */ jsx15(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsx15(DropdownButton, { className: triggerClassName, disabled, children: title }) }),
     /* @__PURE__ */ jsx15(DropdownMenu.Content, { align, className: contentClassName, widthFull, children: /* @__PURE__ */ jsx15(DropdownMenu.Group, { children: optionKeys.map((option) => /* @__PURE__ */ jsx15(
       DropdownMenu.Item,
@@ -873,7 +875,8 @@ var ClientTable = ({
   entriesPerPage = 10,
   minRows,
   noWrap,
-  onEntryClick
+  onEntryClick,
+  ...props
 }) => {
   const [currentPage, setCurrentPage] = useState(1);
   const pageCount = Math.max(Math.ceil(data.length / entriesPerPage), 1);
@@ -881,7 +884,7 @@ var ClientTable = ({
   const lastEntry = Math.min(firstEntry + entriesPerPage - 1, data.length);
   const currentEntries = data.slice(firstEntry - 1, lastEntry);
   const nRows = Math.max(currentEntries.length, minRows ?? -1);
-  return /* @__PURE__ */ jsxs11("div", { className, children: [
+  return /* @__PURE__ */ jsxs11("div", { className, ...props, children: [
     /* @__PURE__ */ jsx48("div", { className: "rounded-md border bg-card tracking-tight text-muted-foreground shadow-sm", children: /* @__PURE__ */ jsxs11(Table, { children: [
       /* @__PURE__ */ jsx48(Table.Header, { children: /* @__PURE__ */ jsx48(Table.Row, { children: columns.map((column, i) => /* @__PURE__ */ jsx48(Table.Head, { className: "whitespace-nowrap text-foreground", children: columnDropdownOptions ? /* @__PURE__ */ jsxs11(DropdownMenu, { children: [
         /* @__PURE__ */ jsxs11(DropdownMenu.Trigger, { className: "flex items-center justify-between gap-3", children: [
@@ -2230,18 +2233,10 @@ var NumberFieldSelect = ({
       /* @__PURE__ */ jsx107(FieldGroup.Description, { description })
     ] }),
     /* @__PURE__ */ jsxs28(Select, { name, value: value?.toString() ?? "", onValueChange: (value2) => setValue(parseFloat(value2)), children: [
-      /* @__PURE__ */ jsx107(
-        Select.Trigger,
-        {
-          "data-cy": `${name}-select-trigger`,
-          "data-testid": `${name}-select-trigger`,
-          disabled: disabled || readOnly,
-          children: /* @__PURE__ */ jsx107(Select.Value, {})
-        }
-      ),
-      /* @__PURE__ */ jsx107(Select.Content, { "data-cy": `${name}-select-content`, "data-testid": `${name}-select-content`, children: Object.keys(options).map((option) => {
+      /* @__PURE__ */ jsx107(Select.Trigger, { "data-testid": `${name}-select-trigger`, disabled: disabled || readOnly, children: /* @__PURE__ */ jsx107(Select.Value, {}) }),
+      /* @__PURE__ */ jsx107(Select.Content, { "data-testid": `${name}-select-content`, children: Object.keys(options).map((option) => {
         const text = (disableAutoPrefix ? "" : `${option} - `) + options[option];
-        return /* @__PURE__ */ jsx107(Select.Item, { "data-cy": `${name}-select-item-${option}`, value: option, children: text }, option);
+        return /* @__PURE__ */ jsx107(Select.Item, { "data-testid": `${name}-select-item-${option}`, value: option, children: text }, option);
       }) })
     ] }),
     /* @__PURE__ */ jsx107(FieldGroup.Error, { error })
@@ -2507,7 +2502,6 @@ var DateField = ({ disabled, error, label, name, readOnly, setValue, value }) =>
         Input,
         {
           autoComplete: "off",
-          "data-cy": "date-input",
           "data-testid": "date-input",
           disabled: disabled || readOnly,
           name,
@@ -2832,16 +2826,8 @@ var StringFieldSelect = ({
       /* @__PURE__ */ jsx123(FieldGroup.Description, { description })
     ] }),
     /* @__PURE__ */ jsxs40(Select, { name, value: value ?? "", onValueChange: (value2) => setValue(value2), children: [
-      /* @__PURE__ */ jsx123(
-        Select.Trigger,
-        {
-          "data-cy": `${name}-select-trigger`,
-          "data-testid": `${name}-select-trigger`,
-          disabled: disabled || readOnly,
-          children: /* @__PURE__ */ jsx123(Select.Value, {})
-        }
-      ),
-      /* @__PURE__ */ jsx123(Select.Content, { "data-cy": `${name}-select-content`, "data-testid": `${name}-select-content`, children: Object.keys(options).map((option) => /* @__PURE__ */ jsx123(Select.Item, { "data-cy": `${name}-select-item-${option}`, value: option, children: options[option] }, option)) })
+      /* @__PURE__ */ jsx123(Select.Trigger, { "data-testid": `${name}-select-trigger`, disabled: disabled || readOnly, children: /* @__PURE__ */ jsx123(Select.Value, {}) }),
+      /* @__PURE__ */ jsx123(Select.Content, { "data-testid": `${name}-select-content`, children: Object.keys(options).map((option) => /* @__PURE__ */ jsx123(Select.Item, { "data-testid": `${name}-select-item-${option}`, value: option, children: options[option] }, option)) })
     ] }),
     /* @__PURE__ */ jsx123(FieldGroup.Error, { error })
   ] });
@@ -3239,22 +3225,11 @@ var Form = ({
           }
         ),
         /* @__PURE__ */ jsxs43("div", { className: "flex w-full gap-3", children: [
-          /* @__PURE__ */ jsx131(
-            Button,
-            {
-              "aria-label": "Submit Button",
-              className: "block w-full",
-              "data-cy": "submit-form",
-              disabled: readOnly,
-              type: "submit",
-              variant: "primary",
-              children: submitBtnLabel ?? t("form.submit")
-            }
-          ),
+          /* @__PURE__ */ jsx131(Button, { "aria-label": "Submit", className: "block w-full", disabled: readOnly, type: "submit", variant: "primary", children: submitBtnLabel ?? t("form.submit") }),
           resetBtn && /* @__PURE__ */ jsx131(
             Button,
             {
-              "aria-label": "Reset Button",
+              "aria-label": "Reset",
               className: "block w-full",
               disabled: readOnly,
               type: "button",
@@ -3453,7 +3428,7 @@ var ListboxDropdown = ({
         {
           checked,
           className: "flex w-full items-center whitespace-nowrap bg-slate-50 p-2 text-sm hover:bg-slate-200 dark:bg-slate-800 dark:hover:bg-slate-700",
-          "data-cy": "select-dropdown-option",
+          "data-testid": "select-dropdown-option",
           onSelect: (event) => {
             event.preventDefault();
             if (checked) {