@grasp-labs/ds-react-components 0.21.0 → 0.22.1

package/dist/index.d.ts

@@ -8,6 +8,7 @@ export * from './components/card';
 export * from './components/checkbox';
 export * from './components/dialog';
 export * from './components/drawer';
+export * from './components/dropdown';
 export * from './components/dynamicIcon';
 export * from './components/errorBoundary';
 export * from './components/errorPage';
@@ -15,6 +16,7 @@ export * from './components/field';
 export * from './components/flow';
 export * from './components/iconButton';
 export * from './components/jsonEditor';
+export * from './components/keyValueList';
 export * from './components/link';
 export * from './components/list';
 export * from './components/logo';

package/dist/{index.esm-eIaA5E0H.js → index.esm-7GxVylgs.js}

@@ -1,4 +1,4 @@
-import { j as o } from "./index-CS4WKD59.js";
+import { j as o } from "./index-CCS3Z4T8.js";
 import { useState as G, useEffect as Oe, createContext as Xt, useRef as ce, useContext as Zt, useMemo as le, useCallback as Ie } from "react";
 const Be = (e, t, n, r, a) => {
   if (!r) throw new Error(a ?? `Invalid property path: ${t}

package/dist/index.js

@@ -1,11 +1,11 @@
-import { A as e, b as o, B as n, a as l, d as c, e as t, ad as r, C as i, K as I, ae as d, f as u, h as C, af as g, ag as T, ah as b, ai as p, aj as h, ak as B, al as D, i as F, am as x, an as E, ab as P, ao as S, ap as L, D as H, k as f, l as m, w, aq as y, E as O, ar as v, as as k, m as R, av as A, ax as M, aw as N, at as W, au as G, F as J, o as V, s as _, n as q, r as z, p as K, t as Q, q as U, ay as Y, u as j, a3 as X, a4 as Z, a5 as $, a6 as aa, a7 as sa, a8 as ea, az as oa, aA as na, I as la, aB as ca, aC as ta, J as ra, a9 as ia, L as Ia, v as da, x as ua, y as Ca, M as ga, U as Ta, P as ba, aD as pa, aE as ha, z as Ba, G as Da, R as Fa, aF as xa, aG as Ea, aH as Pa, aI as Sa, H as La, S as Ha, N as fa, O as ma, Q as wa, aJ as ya, aK as Oa, Y as va, Z as ka, V as Ra, aL as Aa, W as Ma, X as Na, aM as Wa, _ as Ga, $ as Ja, a0 as Va, a1 as _a, a2 as qa, T as za, aa as Ka, aN as Qa, aO as Ua, c as Ya, g as ja, ac as Xa, aP as Za, aQ as $a } from "./index-CS4WKD59.js";
+import { A as e, b as o, B as n, a as l, d as t, e as c, ag as r, C as i, Q as I, ah as d, f as u, h as C, ai as g, aj as T, ak as b, al as p, am as D, an as h, ao as B, i as F, ap as S, aq as x, ae as E, ar as L, as as P, D as H, k as m, l as w, m as y, n as f, y as O, at as v, E as R, au as k, av as A, o as M, ay as N, aA as W, az as G, aw as J, ax as K, F as V, q as _, u as q, p as z, t as Q, r as U, v as Y, s as j, aB as X, w as Z, a6 as $, a7 as aa, a8 as sa, a9 as ea, aa as oa, ab as na, aC as la, aD as ta, I as ca, aE as ra, aF as ia, J as Ia, K as da, ac as ua, L as Ca, x as ga, z as Ta, G as ba, M as pa, X as Da, P as ha, aG as Ba, aH as Fa, H as Sa, N as xa, R as Ea, aI as La, aJ as Pa, aK as Ha, aL as ma, O as wa, S as ya, U as fa, V as Oa, W as va, aM as Ra, aN as ka, $ as Aa, a0 as Ma, Y as Na, aO as Wa, Z as Ga, _ as Ja, aP as Ka, a1 as Va, a2 as _a, a3 as qa, a4 as za, a5 as Qa, T as Ua, ad as Ya, aQ as ja, aR as Xa, c as Za, g as $a, af as as, aS as ss } from "./index-CCS3Z4T8.js";
 export {
   e as Alert,
   o as AnimatedList,
   n as BaseButton,
   l as BaseTextBox,
-  c as Breadcrumb,
-  t as Button,
+  t as Breadcrumb,
+  c as Button,
   r as CalendarIcon,
   i as Card,
   I as CenteredSpinner,
@@ -16,94 +16,96 @@ export {
   T as ChevronDoubleRightIcon,
   b as ChevronLeftIcon,
   p as ChevronRightIcon,
-  h as CircleIcon,
-  B as CloseIcon,
-  D as CogWheelIcon,
+  D as CircleIcon,
+  h as CloseIcon,
+  B as CogWheelIcon,
   F as ConfirmationDialog,
-  x as DashIcon,
-  E as DatabaseIcon,
-  P as DatePicker,
-  S as DeleteIcon,
-  L as DetailsIcon,
+  S as DashIcon,
+  x as DatabaseIcon,
+  E as DatePicker,
+  L as DeleteIcon,
+  P as DetailsIcon,
   H as Dialog,
-  f as Drawer,
-  m as DynamicIcon,
-  w as EMPTY_OPTION_ID,
-  y as EarthIcon,
-  O as ErrorBoundary,
-  v as ErrorFilledIcon,
-  k as ErrorOutlinedIcon,
-  R as ErrorPage,
-  A as ExpandDownIcon,
-  M as ExpandIcon,
-  N as ExpandRightIcon,
-  W as EyeIcon,
-  G as EyeOffIcon,
-  J as Field,
-  V as FieldContent,
-  _ as FieldGroup,
-  q as FieldLabel,
-  z as FieldLegend,
-  K as FieldMessage,
-  Q as FieldSeparator,
-  U as FieldSet,
-  Y as FilterIcon,
-  j as FlowTile,
-  X as H1,
-  Z as H2,
-  $ as H3,
-  aa as H4,
-  sa as H5,
-  ea as H6,
-  oa as HourglassCircleIcon,
-  na as HourglassFilledIcon,
-  la as IconButton,
-  ca as IdeaIcon,
-  ta as InfoOutlinedIcon,
-  ra as JsonEditor,
-  ia as Label,
-  Ia as Link,
-  da as List,
-  ua as ListItem,
-  Ca as Logo,
-  ga as MultiSelect,
-  Ta as Pagination,
-  ba as PasswordTextBox,
-  pa as PlayIcon,
-  ha as PlusIcon,
-  Ba as Popover,
-  Da as Portal,
-  Fa as RadioButton,
-  xa as RecycleIcon,
-  Ea as ReloadIcon,
-  Pa as SaveIcon,
-  Sa as SearchIcon,
-  La as Select,
-  Ha as Sidebar,
+  m as Drawer,
+  w as Dropdown,
+  y as DropdownItem,
+  f as DynamicIcon,
+  O as EMPTY_OPTION_ID,
+  v as EarthIcon,
+  R as ErrorBoundary,
+  k as ErrorFilledIcon,
+  A as ErrorOutlinedIcon,
+  M as ErrorPage,
+  N as ExpandDownIcon,
+  W as ExpandIcon,
+  G as ExpandRightIcon,
+  J as EyeIcon,
+  K as EyeOffIcon,
+  V as Field,
+  _ as FieldContent,
+  q as FieldGroup,
+  z as FieldLabel,
+  Q as FieldLegend,
+  U as FieldMessage,
+  Y as FieldSeparator,
+  j as FieldSet,
+  X as FilterIcon,
+  Z as FlowTile,
+  $ as H1,
+  aa as H2,
+  sa as H3,
+  ea as H4,
+  oa as H5,
+  na as H6,
+  la as HourglassCircleIcon,
+  ta as HourglassFilledIcon,
+  ca as IconButton,
+  ra as IdeaIcon,
+  ia as InfoOutlinedIcon,
+  Ia as JsonEditor,
+  da as KeyValueList,
+  ua as Label,
+  Ca as Link,
+  ga as List,
+  Ta as ListItem,
+  ba as Logo,
+  pa as MultiSelect,
+  Da as Pagination,
+  ha as PasswordTextBox,
+  Ba as PlayIcon,
+  Fa as PlusIcon,
+  Sa as Popover,
+  xa as Portal,
+  Ea as RadioButton,
+  La as RecycleIcon,
+  Pa as ReloadIcon,
+  Ha as SaveIcon,
+  ma as SearchIcon,
+  wa as Select,
+  ya as Sidebar,
   fa as Spinner,
-  ma as Step,
-  wa as Stepper,
-  ya as SuccessFilledIcon,
-  Oa as SuccessOutlinedIcon,
-  va as Tab,
-  ka as TabPanel,
-  Ra as Table,
-  Aa as TableArrowIcon,
-  Ma as TableCell,
-  Na as TableHeaderCell,
-  Wa as TableIcon,
-  Ga as Tag,
-  Ja as TagList,
-  Va as TextBox,
-  _a as Toast,
-  qa as Toaster,
-  za as Tooltip,
-  Ka as UnstyledButton,
-  Qa as WarningFilledIcon,
-  Ua as WarningOutlinedIcon,
-  Ya as colorVariantClasses,
-  ja as getBaseButtonClassName,
-  Xa as icons,
-  Za as useDropdownPosition,
-  $a as useViewportCollision
+  Oa as Step,
+  va as Stepper,
+  Ra as SuccessFilledIcon,
+  ka as SuccessOutlinedIcon,
+  Aa as Tab,
+  Ma as TabPanel,
+  Na as Table,
+  Wa as TableArrowIcon,
+  Ga as TableCell,
+  Ja as TableHeaderCell,
+  Ka as TableIcon,
+  Va as Tag,
+  _a as TagList,
+  qa as TextBox,
+  za as Toast,
+  Qa as Toaster,
+  Ua as Tooltip,
+  Ya as UnstyledButton,
+  ja as WarningFilledIcon,
+  Xa as WarningOutlinedIcon,
+  Za as colorVariantClasses,
+  $a as getBaseButtonClassName,
+  as as icons,
+  ss as useDropdownPosition
 };

package/dist/types/BaseOption.d.ts

@@ -1,5 +1,11 @@
+import { JSX } from 'react';
+type BaseOptionLabel = string | {
+    title: string;
+    richContent: JSX.Element;
+};
 export type BaseOption = {
     id: string | number;
-    label: string;
+    label: BaseOptionLabel;
     disabled?: boolean;
 };
+export {};

package/dist/utils/getOptionTextLabel.d.ts

@@ -0,0 +1,2 @@
+import { BaseOption } from '../types';
+export declare const getOptionTextLabel: (option: BaseOption) => string;

package/dist/utils/index.d.ts

@@ -0,0 +1 @@
+export * from './getOptionTextLabel';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grasp-labs/ds-react-components",
-  "version": "0.21.0",
+  "version": "0.22.1",
   "private": false,
   "license": "Apache-2.0",
   "type": "module",

package/dist/components/flow/MetadataList.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-type MetadataListProps = {
-    metadata: Record<string, ReactNode>;
-};
-export declare function MetadataList({ metadata }: MetadataListProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/flow/StatusIcon.d.ts

@@ -1,5 +0,0 @@
-import { FlowStatus } from './types';
-export type StatusIconProps = {
-    status: FlowStatus | undefined;
-};
-export declare const StatusIcon: ({ status }: StatusIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/flow/TileHeader.d.ts

@@ -1,8 +0,0 @@
-import { ReactNode } from 'react';
-import { FlowStatus } from './types';
-export type TileHeaderProps = {
-    title: string;
-    headerAction: ReactNode | undefined;
-    status: FlowStatus | undefined;
-};
-export declare const TileHeader: ({ title, status, headerAction, }: TileHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/flow/types.d.ts

@@ -1,15 +0,0 @@
-import { Position } from '@xyflow/system';
-import { ReactNode } from 'react';
-import { IconName } from '../../icons';
-export type FlowStatus = "success" | "warning" | "error" | "pending" | "not-run";
-export type FlowPosition = Position | "none";
-export type FlowData = {
-    title: string;
-    status?: FlowStatus;
-    iconName?: IconName;
-    metadata?: Record<string, ReactNode>;
-    children?: ReactNode;
-    headerAction?: ReactNode;
-    targetPosition?: FlowPosition;
-    sourcePosition?: FlowPosition;
-};

package/dist/hooks/useViewportCollision.d.ts

@@ -1,7 +0,0 @@
-import { RefObject } from 'react';
-type UseViewportCollisionOptions = {
-    isOpen: boolean;
-    containerRef: RefObject<HTMLElement | null>;
-};
-export declare const useViewportCollision: ({ isOpen, containerRef, }: UseViewportCollisionOptions) => boolean;
-export {};