@cognite/aura 0.2.0 → 0.3.0

package/dist/components/ui/core/accordion/accordion.d.ts

@@ -1,5 +1,5 @@
-import { ComponentProps } from 'react';
-import { Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
+import { ForwardRefExoticComponent, RefAttributes, ComponentProps } from 'react';
+import { AccordionItemProps, AccordionPanelProps, AccordionTriggerProps, Accordion as AccordionPrimitive } from '@base-ui/react/accordion';
 import { Icon } from '@tabler/icons-react';
 type AccordionCommonProps = Omit<ComponentProps<typeof AccordionPrimitive.Root>, 'multiple' | 'value' | 'defaultValue' | 'onValueChange'>;
 type AccordionSingleProps = {
@@ -15,10 +15,10 @@ type AccordionMultipleProps = {
     defaultValue?: string[];
     onValueChange?: (value: string[]) => void;
 };
-declare const Accordion: import('react').ForwardRefExoticComponent<(Omit<AccordionCommonProps & AccordionSingleProps, "ref"> | Omit<AccordionCommonProps & AccordionMultipleProps, "ref">) & import('react').RefAttributes<HTMLDivElement>>;
-declare const AccordionItem: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').AccordionItemProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const AccordionTrigger: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').AccordionTriggerProps & {
+declare const Accordion: ForwardRefExoticComponent<Omit<AccordionCommonProps, 'ref'> & (AccordionSingleProps | AccordionMultipleProps) & RefAttributes<HTMLDivElement>>;
+declare const AccordionItem: ForwardRefExoticComponent<Omit<AccordionItemProps, 'ref'> & RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: ForwardRefExoticComponent<Omit<AccordionTriggerProps & {
     icon?: Icon;
-}, "ref"> & import('react').RefAttributes<HTMLElement>>;
-declare const AccordionContent: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').AccordionPanelProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+}, 'ref'> & RefAttributes<HTMLElement>>;
+declare const AccordionContent: ForwardRefExoticComponent<Omit<AccordionPanelProps, 'ref'> & RefAttributes<HTMLDivElement>>;
 export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/components/ui/core/accordion/accordion.js

@@ -3,63 +3,65 @@ import { forwardRef as d } from "react";
 import { Accordion as r } from "@base-ui/react/accordion";
 import { IconChevronDown as A } from "@tabler/icons-react";
 import { cn as u } from "../../../../lib/utils.js";
-const C = d((e, t) => {
-  if (e.type === "multiple") {
+const C = d(
+  (e, t) => {
+    if (e.type === "multiple") {
+      const {
+        type: s,
+        value: c,
+        defaultValue: b,
+        onValueChange: m,
+        ...x
+      } = e;
+      return /* @__PURE__ */ o(
+        r.Root,
+        {
+          ref: t,
+          "data-slot": "accordion",
+          multiple: !0,
+          value: c,
+          defaultValue: b,
+          onValueChange: (y) => {
+            if (!m) return;
+            const N = y.filter(
+              (V) => V != null
+            );
+            m(N);
+          },
+          ...x
+        }
+      );
+    }
     const {
-      type: s,
-      value: c,
-      defaultValue: b,
-      onValueChange: m,
-      ...x
-    } = e;
+      type: n,
+      collapsible: i = !1,
+      value: l,
+      defaultValue: a,
+      onValueChange: g,
+      ...p
+    } = e, h = l === void 0 ? void 0 : l === "" ? [] : [l], v = a === void 0 ? void 0 : a === "" ? [] : [a];
     return /* @__PURE__ */ o(
       r.Root,
       {
         ref: t,
         "data-slot": "accordion",
-        multiple: !0,
-        value: c,
-        defaultValue: b,
-        onValueChange: (y) => {
-          if (!m) return;
-          const N = y.filter(
-            (V) => V != null
-          );
-          m(N);
+        multiple: !1,
+        value: h,
+        defaultValue: v,
+        onValueChange: (s, c) => {
+          if (g) {
+            if (!i && s.length === 0) {
+              c.cancel();
+              return;
+            }
+            g(s[0] ?? "");
+          }
         },
-        ...x
+        ...p
       }
     );
   }
-  const {
-    type: n,
-    collapsible: i = !1,
-    value: l,
-    defaultValue: a,
-    onValueChange: g,
-    ...p
-  } = e, h = l === void 0 ? void 0 : l === "" ? [] : [l], v = a === void 0 ? void 0 : a === "" ? [] : [a];
-  return /* @__PURE__ */ o(
-    r.Root,
-    {
-      ref: t,
-      "data-slot": "accordion",
-      multiple: !1,
-      value: h,
-      defaultValue: v,
-      onValueChange: (s, c) => {
-        if (g) {
-          if (!i && s.length === 0) {
-            c.cancel();
-            return;
-          }
-          g(s[0] ?? "");
-        }
-      },
-      ...p
-    }
-  );
-});
+);
 C.displayName = "Accordion";
 const w = d(({ className: e, ...t }, n) => /* @__PURE__ */ o(
   r.Item,

package/dist/components/ui/core/action-toolbar/action-toolbar.d.ts

@@ -0,0 +1,41 @@
+import { ForwardRefExoticComponent, RefAttributes, ComponentProps, ReactNode } from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { ClassProp } from 'class-variance-authority/types';
+import { Button } from '../button/button';
+interface ActionToolbarVariantProps {
+    width?: 'full' | 'fit' | null;
+}
+declare const actionToolbarVariants: (props?: (ActionToolbarVariantProps & ClassProp) | undefined) => string;
+type ActionToolbarProps = ComponentProps<'div'> & VariantProps<typeof actionToolbarVariants> & {
+    selectedCount?: number;
+};
+declare const ActionToolbar: ForwardRefExoticComponent<Omit<ActionToolbarProps, 'ref'> & RefAttributes<HTMLDivElement>>;
+declare const ActionToolbarSelection: ForwardRefExoticComponent<ComponentProps<'div'> & RefAttributes<HTMLDivElement>>;
+type ActionToolbarSelectionSummaryProps = ComponentProps<'div'> & {
+    count?: ReactNode;
+    label?: ReactNode;
+};
+declare const ActionToolbarSelectionSummary: ForwardRefExoticComponent<Omit<ActionToolbarSelectionSummaryProps, 'ref'> & RefAttributes<HTMLDivElement>>;
+declare const ActionToolbarActions: ForwardRefExoticComponent<ComponentProps<'div'> & RefAttributes<HTMLDivElement>>;
+type ActionToolbarActionProps = Omit<ComponentProps<typeof Button>, 'size'> & ({
+    iconOnly: true;
+    'aria-label': string;
+} | {
+    iconOnly?: false;
+    'aria-label'?: string;
+});
+declare const ActionToolbarAction: ForwardRefExoticComponent<Omit<ComponentProps<typeof Button>, 'size' | 'ref'> & ({
+    iconOnly: true;
+    'aria-label': string;
+} | {
+    iconOnly?: false;
+    'aria-label'?: string;
+}) & RefAttributes<HTMLElement>>;
+type ActionToolbarActionClearProps = Omit<ActionToolbarActionProps, 'variant' | 'iconOnly' | 'children'> & {
+    icon?: ReactNode;
+    label?: ReactNode;
+};
+declare const ActionToolbarActionClear: ForwardRefExoticComponent<Omit<ActionToolbarActionClearProps, 'ref'> & RefAttributes<HTMLElement>>;
+type ActionToolbarPrimaryActionProps = Omit<ActionToolbarActionProps, 'variant' | 'iconOnly'>;
+declare const ActionToolbarPrimaryAction: ForwardRefExoticComponent<Omit<ActionToolbarPrimaryActionProps, 'ref'> & RefAttributes<HTMLElement>>;
+export { ActionToolbar, ActionToolbarAction, ActionToolbarActionClear, ActionToolbarActions, ActionToolbarPrimaryAction, ActionToolbarSelection, ActionToolbarSelectionSummary, };

package/dist/components/ui/core/action-toolbar/action-toolbar.js

@@ -0,0 +1,176 @@
+import { jsx as i, jsxs as m } from "react/jsx-runtime";
+import { forwardRef as e, useMemo as b, useContext as A, createContext as x } from "react";
+import { IconX as T } from "@tabler/icons-react";
+import { cva as y } from "class-variance-authority";
+import { cn as s } from "../../../../lib/utils.js";
+import { Button as f } from "../button/button.js";
+import { TooltipProvider as g, Tooltip as h, TooltipTrigger as w, TooltipContent as N } from "../tooltip/tooltip.js";
+const v = y(
+  "min-w-[400px] max-w-[1200px] h-14 flex items-center justify-between gap-3 bg-raised-background text-foreground-fixed-light pl-4 pr-3 rounded-xl shadow-default",
+  {
+    variants: {
+      width: {
+        full: "w-full",
+        fit: "w-fit"
+      }
+    },
+    defaultVariants: {
+      width: "full"
+    }
+  }
+), p = x({
+  selectedCount: void 0
+}), k = e(
+  ({ className: t, width: a, role: n = "toolbar", selectedCount: o, ...r }, l) => {
+    const c = typeof o == "number" && o === 0, d = b(() => ({ selectedCount: o }), [o]);
+    return c ? null : /* @__PURE__ */ i(g, { delayDuration: 0, children: /* @__PURE__ */ i(p.Provider, { value: d, children: /* @__PURE__ */ i(
+      "div",
+      {
+        ref: l,
+        "data-slot": "action-toolbar",
+        role: n,
+        className: s(v({ width: a }), t),
+        ...r
+      }
+    ) }) });
+  }
+);
+k.displayName = "ActionToolbar";
+const C = e(
+  ({ className: t, role: a = "group", ...n }, o) => /* @__PURE__ */ i(
+    "div",
+    {
+      ref: o,
+      "data-slot": "action-toolbar-selection",
+      role: a,
+      className: s("flex min-w-0 shrink-0 items-center gap-3", t),
+      ...n
+    }
+  )
+);
+C.displayName = "ActionToolbarSelection";
+const S = e(
+  ({ className: t, count: a, label: n = "selected", children: o, ...r }, l) => {
+    const { selectedCount: c } = A(p), d = a ?? c;
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: l,
+        "data-slot": "action-toolbar-selection-summary",
+        className: s("flex min-w-0", t),
+        ...r,
+        children: o ?? /* @__PURE__ */ m(
+          "span",
+          {
+            "data-slot": "action-toolbar-selection-label",
+            className: "flex min-w-0 items-center gap-0.5 text-sm font-medium leading-4.5 tracking-normal text-foreground-fixed-light",
+            children: [
+              d == null ? null : /* @__PURE__ */ i("span", { children: d }),
+              /* @__PURE__ */ i("span", { className: "truncate", children: n })
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+S.displayName = "ActionToolbarSelectionSummary";
+const O = e(
+  ({ className: t, role: a = "group", ...n }, o) => /* @__PURE__ */ i(
+    "div",
+    {
+      ref: o,
+      "data-slot": "action-toolbar-actions",
+      role: a,
+      className: s(
+        "flex min-w-0 shrink-0 items-center justify-end gap-1",
+        t
+      ),
+      ...n
+    }
+  )
+);
+O.displayName = "ActionToolbarActions";
+const u = e(
+  ({
+    className: t,
+    variant: a = "ghostOnDark",
+    iconOnly: n = !1,
+    "aria-label": o,
+    children: r,
+    ...l
+  }, c) => n && o ? /* @__PURE__ */ m(h, { children: [
+    /* @__PURE__ */ i(
+      w,
+      {
+        render: /* @__PURE__ */ i(
+          f,
+          {
+            ref: c,
+            "data-slot": "action-toolbar-action",
+            variant: a,
+            size: "icon",
+            "aria-label": o,
+            className: t,
+            ...l,
+            children: r
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ i(N, { sideOffset: 18, children: o })
+  ] }) : /* @__PURE__ */ i(
+    f,
+    {
+      ref: c,
+      "data-slot": "action-toolbar-action",
+      variant: a,
+      size: n ? "icon" : "default",
+      "aria-label": o,
+      className: t,
+      ...l,
+      children: r
+    }
+  )
+);
+u.displayName = "ActionToolbarAction";
+const j = e(
+  ({ icon: t, label: a = "Clear", ...n }, o) => /* @__PURE__ */ m(
+    u,
+    {
+      ref: o,
+      "data-slot": "action-toolbar-action-clear",
+      variant: "secondaryOnDark",
+      iconOnly: !1,
+      ...n,
+      children: [
+        t ?? /* @__PURE__ */ i(T, {}),
+        a
+      ]
+    }
+  )
+);
+j.displayName = "ActionToolbarActionClear";
+const D = e(
+  ({ className: t, ...a }, n) => /* @__PURE__ */ i(
+    u,
+    {
+      ref: n,
+      "data-slot": "action-toolbar-primary-action",
+      variant: "defaultOnDark",
+      iconOnly: !1,
+      className: s("ml-2", t),
+      ...a
+    }
+  )
+);
+D.displayName = "ActionToolbarPrimaryAction";
+export {
+  k as ActionToolbar,
+  u as ActionToolbarAction,
+  j as ActionToolbarActionClear,
+  O as ActionToolbarActions,
+  D as ActionToolbarPrimaryAction,
+  C as ActionToolbarSelection,
+  S as ActionToolbarSelectionSummary
+};

package/dist/components/ui/core/alert/alert.d.ts

@@ -1,20 +1,31 @@
-import { ComponentProps, ReactNode } from 'react';
+import { ForwardRefExoticComponent, RefAttributes, ComponentProps, ReactNode } from 'react';
 import { VariantProps } from 'class-variance-authority';
-type AlertVariant = 'default' | 'secondary' | 'warning' | 'error';
-declare const alertVariants: (props?: ({
-    variant?: "default" | "secondary" | "warning" | "error" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+import { ClassProp } from 'class-variance-authority/types';
+type AlertVariant = 'default' | 'info' | 'warning' | 'error';
+/** @deprecated Use `'info'` instead. Will be removed in a future major release. */
+type DeprecatedAlertVariant = 'secondary';
+type AlertVariantInput = AlertVariant | DeprecatedAlertVariant;
+type AlertStyle = 'card' | 'strip';
+interface AlertVariantProps {
+    variant?: 'default' | 'error' | 'info' | 'warning' | null;
+    alertStyle?: 'card' | 'strip' | null;
+}
+declare const alertVariants: (props?: (AlertVariantProps & ClassProp) | undefined) => string;
 type AlertProps = ComponentProps<'div'> & Omit<VariantProps<typeof alertVariants>, 'variant'> & {
-    variant?: AlertVariant;
+    variant?: AlertVariantInput;
+    alertStyle?: AlertStyle;
     visible?: boolean;
     defaultVisible?: boolean;
     onClose?: () => void;
     icon?: ReactNode;
 };
-declare const Alert: import('react').ForwardRefExoticComponent<Omit<AlertProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const AlertTitle: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const AlertDescription: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const AlertActions: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const AlertButton: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
-declare const AlertClose: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+declare const Alert: ForwardRefExoticComponent<Omit<AlertProps, 'ref'> & RefAttributes<HTMLDivElement>>;
+declare const AlertTitle: ForwardRefExoticComponent<ComponentProps<'div'> & RefAttributes<HTMLDivElement>>;
+declare const AlertDescription: ForwardRefExoticComponent<ComponentProps<'div'> & RefAttributes<HTMLDivElement>>;
+declare const AlertActions: ForwardRefExoticComponent<ComponentProps<'div'> & RefAttributes<HTMLDivElement>>;
+type AlertButtonVariant = 'default' | 'ghost';
+declare const AlertButton: ForwardRefExoticComponent<Omit<ComponentProps<'button'> & {
+    variant?: AlertButtonVariant;
+}, 'ref'> & RefAttributes<HTMLButtonElement>>;
+declare const AlertClose: ForwardRefExoticComponent<ComponentProps<'button'> & RefAttributes<HTMLButtonElement>>;
 export { Alert, AlertTitle, AlertDescription, AlertActions, AlertButton, AlertClose, };