@commercelayer/app-elements 0.2.1 → 0.3.0

package/dist/main.d.ts

@@ -8,6 +8,7 @@ export { getAvatarSrcFromRate, getParcelTrackingDetail, getParcelTrackingDetails
 export { useClickAway } from './hooks/useClickAway';
 export { useDelayShow } from './hooks/useDelayShow';
 export { useIsChanged } from './hooks/useIsChanged';
+export { useOnBlurFromContainer } from './hooks/useOnBlurFromContainer';
 export { useOverlay } from './hooks/useOverlay';
 export { CoreSdkProvider, useCoreApi, useCoreSdkProvider } from './providers/CoreSdkProvider';
 export { ErrorBoundary } from './providers/ErrorBoundary';
@@ -16,7 +17,6 @@ export { A } from './ui/atoms/A';
 export { Avatar } from './ui/atoms/Avatar';
 export { AvatarLetter } from './ui/atoms/AvatarLetter';
 export { Badge, badgeVariants } from './ui/atoms/Badge';
-export { BlockCode } from './ui/atoms/BlockCode';
 export { Button } from './ui/atoms/Button';
 export { ButtonFilter } from './ui/atoms/ButtonFilter';
 export { Card } from './ui/atoms/Card';
@@ -26,7 +26,7 @@ export { EmptyState } from './ui/atoms/EmptyState';
 export { Grid } from './ui/atoms/Grid';
 export { Hint } from './ui/atoms/Hint';
 export { Hr } from './ui/atoms/Hr';
-export { Icon, iconNames } from './ui/atoms/Icon';
+export { Icon, type IconProps } from './ui/atoms/Icon';
 export { PageHeading } from './ui/atoms/PageHeading';
 export { Pagination } from './ui/atoms/Pagination';
 export { Progress } from './ui/atoms/Progress';
@@ -42,10 +42,9 @@ export { Table, Td, Th, Tr } from './ui/atoms/Table';
 export { Tab, Tabs } from './ui/atoms/Tabs';
 export { Tag } from './ui/atoms/Tag';
 export { Text } from './ui/atoms/Text';
-export { DropdownMenu, DropdownMenuDivider, DropdownMenuItem } from './ui/atoms/dropdown';
 export { ActionButtons } from './ui/composite/ActionButtons';
 export { CardDialog } from './ui/composite/CardDialog';
-export { ContextMenu } from './ui/composite/ContextMenu';
+export { Dropdown, DropdownDivider, DropdownItem } from './ui/composite/Dropdown';
 export { List } from './ui/composite/List';
 export { ListDetails } from './ui/composite/ListDetails';
 export { ListDetailsItem } from './ui/composite/ListDetailsItem';
@@ -80,6 +79,7 @@ export { HookedInputToggleButton, InputToggleButton, type InputToggleButtonProps
 export { Label } from './ui/forms/Label';
 export { Legend } from './ui/forms/Legend';
 export { HookedValidationApiError, HookedValidationError, setApiFormErrors, useValidationFeedback } from './ui/forms/ReactHookForm';
+export { ResourceAddress } from './ui/resources/ResourceAddress';
 export { ResourceLineItems } from './ui/resources/ResourceLineItems';
 export { ResourceList } from './ui/resources/ResourceList';
 export { ResourceListItem } from './ui/resources/ResourceListItem';

package/dist/main.js

@@ -1,4 +1,4 @@
-import { an as u, b0 as i, ao as b, ap as p, aq as l, as as c, at as d, au as g, av as m, b1 as S, aw as I, b2 as k, ax as T, ag as D, aZ as R, a_ as C, a$ as y, ay as h, aj as A, az as H, aA as P, be as B, bf as F, bh as L, bk as N, bo as V, bq as f, bx as v, bz as O, bG as w, bI as x, bK as E, bN as G, bR as M, bS as J, aB as U, aC as W, bg as X, bi as Y, bj as Z, bl as $, bn as j, bp as q, br as z, bs as K, bt as Q, bu as _, bv as aa, bw as ea, by as sa, bA as ta, bH as ra, bJ as oa, bL as na, bM as ua, bO as ia, bP as ba, bQ as pa, b3 as la, b4 as ca, b5 as da, b6 as ga, ak as ma, b7 as Sa, aE as Ia, b8 as ka, b9 as Ta, aF as Da, aG as Ra, aH as Ca, ba as ya, bV as ha, bW as Aa, bX as Ha, bY as Pa, bZ as Ba, b_ as Fa, b$ as La, c0 as Na, bb as Va, aI as fa, aJ as va, aK as Oa, aL as wa, aN as xa, aO as Ea, aP as Ga, aQ as Ma, aV as Ja, aR as Ua, bc as Wa, aW as Xa, aX as Ya, aS as Za, aY as $a, aT as ja, bd as qa, al as za, aU as Ka, ar as Qa, a2 as _a, a1 as ae, bB as ee, bm as se, X as te, a3 as re, a4 as oe, a5 as ne, c2 as ue, c3 as ie, bC as be, Y as pe, Z as le, c4 as ce, c5 as de, c6 as ge, c7 as me, c8 as Se, c9 as Ie, a6 as ke, a7 as Te, ca as De, cb as Re, cc as Ce, a8 as ye, a9 as he, T as Ae, aa as He, ab as Pe, aD as Be, V as Fe, bD as Le, bE as Ne, bF as Ve, U as fe, W as ve, bT as Oe, $ as we, a0 as xe, ac as Ee, ah as Ge, ai as Me, ad as Je, ae as Ue, af as We, c1 as Xe, am as Ye, bU as Ze, aM as $e } from "./main-ef0d4ef2.js";
+import { ao as u, aY as i, ap as b, aq as p, ar as l, at as c, au as d, av as g, aZ as m, aw as S, ax as I, ah as k, a_ as T, a$ as D, b0 as R, ay as y, ak as C, az as A, aA as h, bc as H, bd as P, bf as F, bi as B, bm as L, bo as O, bv as V, bx as f, bE as v, bG as N, bI as w, bL as E, bP as G, bQ as x, aB as M, aC as J, be as U, bg as W, bh as X, bj as Y, bl as Z, bn as $, bp as j, bq as q, br as z, bs as K, bt as Q, bu as _, bw as aa, by as ea, bF as sa, bH as ta, bJ as ra, bK as oa, bM as na, bN as ua, bO as ia, b1 as ba, b2 as pa, b3 as la, b4 as ca, al as da, b5 as ga, aD as ma, b6 as Sa, b7 as Ia, aE as ka, aF as Ta, aG as Da, b8 as Ra, bT as ya, bU as Ca, bV as Aa, bW as ha, bX as Ha, bY as Pa, bZ as Fa, b_ as Ba, b$ as La, b9 as Oa, aH as Va, aI as fa, aJ as va, aK as Na, aM as wa, aN as Ea, aO as Ga, aP as xa, aU as Ma, aQ as Ja, ba as Ua, aV as Wa, aW as Xa, aR as Ya, aX as Za, aS as $a, bb as ja, am as qa, aT as za, as as Ka, a2 as Qa, a1 as _a, bz as ae, bk as ee, X as se, a3 as te, a4 as re, a5 as oe, c1 as ne, c2 as ue, bA as ie, Y as be, Z as pe, c3 as le, c4 as ce, c5 as de, c6 as ge, c7 as me, c8 as Se, a6 as Ie, a7 as ke, c9 as Te, ca as De, cb as Re, a8 as ye, a9 as Ce, T as Ae, aa as he, ab as He, V as Pe, bB as Fe, bC as Be, bD as Le, U as Oe, W as Ve, bR as fe, $ as ve, a0 as Ne, ac as we, ai as Ee, aj as Ge, ad as xe, ae as Me, af as Je, ag as Ue, c0 as We, an as Xe, bS as Ye, aL as Ze } from "./main-49356a73.js";
 import "react";
 import "react-dom";
 import "@commercelayer/sdk";
@@ -10,148 +10,147 @@ export {
   b as Avatar,
   p as AvatarLetter,
   l as Badge,
-  c as BlockCode,
-  d as Button,
-  g as ButtonFilter,
-  m as Card,
-  S as CardDialog,
-  I as Container,
-  k as ContextMenu,
-  T as CopyToClipboard,
-  D as CoreSdkProvider,
-  R as DropdownMenu,
-  C as DropdownMenuDivider,
-  y as DropdownMenuItem,
-  h as EmptyState,
-  A as ErrorBoundary,
-  H as Grid,
-  P as Hint,
-  B as HookedForm,
-  F as HookedInput,
-  L as HookedInputCheckbox,
-  N as HookedInputCurrency,
-  V as HookedInputDate,
-  f as HookedInputDateRange,
-  v as HookedInputResourceGroup,
-  O as HookedInputSelect,
-  w as HookedInputSimpleSelect,
-  x as HookedInputSpinner,
-  E as HookedInputSwitch,
-  G as HookedInputToggleButton,
-  M as HookedValidationApiError,
-  J as HookedValidationError,
-  U as Hr,
-  W as Icon,
-  X as Input,
-  Y as InputCheckbox,
-  Z as InputCheckboxGroup,
-  $ as InputCurrency,
-  j as InputCurrencyRange,
-  q as InputDate,
-  z as InputDateRange,
-  K as InputFeedback,
-  Q as InputFile,
-  _ as InputJson,
-  aa as InputRadioGroup,
-  ea as InputReadonly,
-  sa as InputResourceGroup,
-  ta as InputSelect,
-  ra as InputSimpleSelect,
-  oa as InputSpinner,
-  na as InputSwitch,
-  ua as InputTextArea,
-  ia as InputToggleButton,
-  ba as Label,
-  pa as Legend,
-  la as List,
-  ca as ListDetails,
-  da as ListDetailsItem,
-  ga as ListItem,
-  ma as MetaTags,
-  Sa as PageError,
-  Ia as PageHeading,
-  ka as PageLayout,
-  Ta as PageSkeleton,
-  Da as Pagination,
-  Ra as Progress,
-  Ca as RadialProgress,
-  ya as Report,
-  ha as ResourceLineItems,
+  c as Button,
+  d as ButtonFilter,
+  g as Card,
+  m as CardDialog,
+  S as Container,
+  I as CopyToClipboard,
+  k as CoreSdkProvider,
+  T as Dropdown,
+  D as DropdownDivider,
+  R as DropdownItem,
+  y as EmptyState,
+  C as ErrorBoundary,
+  A as Grid,
+  h as Hint,
+  H as HookedForm,
+  P as HookedInput,
+  F as HookedInputCheckbox,
+  B as HookedInputCurrency,
+  L as HookedInputDate,
+  O as HookedInputDateRange,
+  V as HookedInputResourceGroup,
+  f as HookedInputSelect,
+  v as HookedInputSimpleSelect,
+  N as HookedInputSpinner,
+  w as HookedInputSwitch,
+  E as HookedInputToggleButton,
+  G as HookedValidationApiError,
+  x as HookedValidationError,
+  M as Hr,
+  J as Icon,
+  U as Input,
+  W as InputCheckbox,
+  X as InputCheckboxGroup,
+  Y as InputCurrency,
+  Z as InputCurrencyRange,
+  $ as InputDate,
+  j as InputDateRange,
+  q as InputFeedback,
+  z as InputFile,
+  K as InputJson,
+  Q as InputRadioGroup,
+  _ as InputReadonly,
+  aa as InputResourceGroup,
+  ea as InputSelect,
+  sa as InputSimpleSelect,
+  ta as InputSpinner,
+  ra as InputSwitch,
+  oa as InputTextArea,
+  na as InputToggleButton,
+  ua as Label,
+  ia as Legend,
+  ba as List,
+  pa as ListDetails,
+  la as ListDetailsItem,
+  ca as ListItem,
+  da as MetaTags,
+  ga as PageError,
+  ma as PageHeading,
+  Sa as PageLayout,
+  Ia as PageSkeleton,
+  ka as Pagination,
+  Ta as Progress,
+  Da as RadialProgress,
+  Ra as Report,
+  ya as ResourceAddress,
+  Ca as ResourceLineItems,
   Aa as ResourceList,
-  Ha as ResourceListItem,
-  Pa as ResourceMetadata,
-  Ba as ResourceOrderSummary,
+  ha as ResourceListItem,
+  Ha as ResourceMetadata,
+  Pa as ResourceOrderSummary,
   Fa as ResourceOrderTimeline,
-  La as ResourceShipmentParcels,
-  Na as ResourceTags,
-  Va as SearchBar,
-  fa as Section,
-  va as Skeleton,
-  Oa as SkeletonItem,
-  wa as SkeletonTemplate,
-  xa as Spacer,
+  Ba as ResourceShipmentParcels,
+  La as ResourceTags,
+  Oa as SearchBar,
+  Va as Section,
+  fa as Skeleton,
+  va as SkeletonItem,
+  Na as SkeletonTemplate,
+  wa as Spacer,
   Ea as Stack,
   Ga as StatusDot,
-  Ma as Steps,
-  Ja as Tab,
-  Ua as Table,
-  Wa as TableData,
-  Xa as Tabs,
-  Ya as Tag,
-  Za as Td,
-  $a as Text,
-  ja as Th,
-  qa as Timeline,
-  za as TokenProvider,
-  Ka as Tr,
-  Qa as badgeVariants,
-  _a as computeFullname,
-  ae as downloadJsonAsFile,
-  ee as flatSelectValues,
-  se as formatCentsToCurrency,
-  te as formatDate,
-  re as formatDisplayName,
-  oe as formatResourceName,
-  ne as getAvatarSrcFromRate,
-  ue as getCustomerDisplayStatus,
-  ie as getCustomerStatusName,
-  be as getDefaultValueFromFlatten,
-  pe as getIsoDateAtDayEdge,
-  le as getIsoDateAtDaysBefore,
-  ce as getOrderDisplayStatus,
-  de as getOrderFulfillmentStatusName,
-  ge as getOrderPaymentStatusName,
-  me as getOrderStatusName,
-  Se as getOrderTransactionPastTense,
-  Ie as getOrderTriggerAttributeName,
-  ke as getParcelTrackingDetail,
-  Te as getParcelTrackingDetails,
-  De as getReturnDisplayStatus,
-  Re as getReturnStatusName,
-  Ce as getReturnTriggerAttributeName,
+  xa as Steps,
+  Ma as Tab,
+  Ja as Table,
+  Ua as TableData,
+  Wa as Tabs,
+  Xa as Tag,
+  Ya as Td,
+  Za as Text,
+  $a as Th,
+  ja as Timeline,
+  qa as TokenProvider,
+  za as Tr,
+  Ka as badgeVariants,
+  Qa as computeFullname,
+  _a as downloadJsonAsFile,
+  ae as flatSelectValues,
+  ee as formatCentsToCurrency,
+  se as formatDate,
+  te as formatDisplayName,
+  re as formatResourceName,
+  oe as getAvatarSrcFromRate,
+  ne as getCustomerDisplayStatus,
+  ue as getCustomerStatusName,
+  ie as getDefaultValueFromFlatten,
+  be as getIsoDateAtDayEdge,
+  pe as getIsoDateAtDaysBefore,
+  le as getOrderDisplayStatus,
+  ce as getOrderFulfillmentStatusName,
+  de as getOrderPaymentStatusName,
+  ge as getOrderStatusName,
+  me as getOrderTransactionPastTense,
+  Se as getOrderTriggerAttributeName,
+  Ie as getParcelTrackingDetail,
+  ke as getParcelTrackingDetails,
+  Te as getReturnDisplayStatus,
+  De as getReturnStatusName,
+  Re as getReturnTriggerAttributeName,
   ye as getShipmentRate,
-  he as getShipmentRates,
+  Ce as getShipmentRates,
   Ae as goBack,
-  He as hasBeenPurchased,
-  Pe as hasSingleTracking,
-  Be as iconNames,
-  Fe as isAttachmentValidNote,
-  Le as isGroupedSelectValues,
-  Ne as isMultiValueSelected,
-  Ve as isSingleValueSelected,
-  fe as navigateTo,
-  ve as referenceOrigins,
-  Oe as setApiFormErrors,
-  we as sortAndGroupByDate,
-  xe as timeSeparator,
-  Ee as useClickAway,
-  Ge as useCoreApi,
-  Me as useCoreSdkProvider,
-  Je as useDelayShow,
-  Ue as useIsChanged,
-  We as useOverlay,
-  Xe as useResourceFilters,
-  Ye as useTokenProvider,
-  Ze as useValidationFeedback,
-  $e as withSkeletonTemplate
+  he as hasBeenPurchased,
+  He as hasSingleTracking,
+  Pe as isAttachmentValidNote,
+  Fe as isGroupedSelectValues,
+  Be as isMultiValueSelected,
+  Le as isSingleValueSelected,
+  Oe as navigateTo,
+  Ve as referenceOrigins,
+  fe as setApiFormErrors,
+  ve as sortAndGroupByDate,
+  Ne as timeSeparator,
+  we as useClickAway,
+  Ee as useCoreApi,
+  Ge as useCoreSdkProvider,
+  xe as useDelayShow,
+  Me as useIsChanged,
+  Je as useOnBlurFromContainer,
+  Ue as useOverlay,
+  We as useResourceFilters,
+  Xe as useTokenProvider,
+  Ye as useValidationFeedback,
+  Ze as withSkeletonTemplate
 };

package/dist/providers/CoreSdkProvider/useCoreApi.d.ts

@@ -4,5 +4,28 @@ import { type Fetcher, type SWRConfiguration, type SWRResponse } from 'swr';
 import { type ConditionalKeys } from 'type-fest';
 type GenericMethod = (...args: any) => Promise<any>;
 type ForceToBeMethod<Method> = Method extends GenericMethod ? Method : GenericMethod;
+/**
+ * This hook performs api request base on [`@commercelayer/sdk`](https://github.com/commercelayer/commercelayer-sdk) and [`swr`](https://swr.vercel.app/).
+ *
+ * This is an example of getting the order with id `1234`.
+ *
+ * If you're used to use our sdk you can write:
+ * ```ts
+ * const order = await client.orders.retrieve('1234')
+ * ```
+ *
+ * With `useCoreApi` you'll write instead:
+ * ```ts
+ * const {
+ *   data: order,
+ *   isLoading
+ * } = useCoreApi('orders', 'retrieve', ['1234'])
+ * ```
+ * @param resource Resource type
+ * @param action Related resource action
+ * @param args Action arguments
+ * @param config SWR options
+ * @returns SWR response
+ */
 export declare function useCoreApi<Resource extends ResourceTypeLock, Action extends ConditionalKeys<CommerceLayerClient[Resource], GenericMethod>, Method extends ForceToBeMethod<CommerceLayerClient[Resource][Action]>, Args extends Parameters<Method>, Output extends Awaited<ReturnType<Method>>, SWROptions extends SWRConfiguration<Output, any, Fetcher<Output>>>(resource: Resource, action: Action, args: Args | null, config?: SWROptions): SWRResponse<Output, any, SWROptions>;
 export {};

package/dist/providers/TokenProvider/TokenProvider.d.ts

@@ -14,23 +14,30 @@ export interface TokenProviderValue {
 }
 export interface TokenProviderProps {
     /**
-     * Token kind (will be validated)
-     * Eg. `integration` or `webapp` but also `imports` or `orders` in case of dashboard-generated token
+     * Token kind (will be validated).
+     * For example: `integration`, `sales_channel` or `webapp` but also `imports` or `orders` in case of dashboard-generated token.
      */
     kind: TokenProviderTokenApplicationKind;
     /**
      * Slug of the current app. It needs to match one of the allowed app slugs enabled in the dashboard.
-     * Example: `orders`, `imports`, `exports`, `shipments`, `webhooks`, `returns`
      * Will be used to persist token for current app only.
      */
     appSlug: TokenProviderAllowedApp;
     /**
-     * Required when application is forked or running as self-hosted.
+     * Skip domain slug validation when is dev mode
+     */
+    devMode: boolean;
+    /**
+     * Entire app content
+     */
+    children: ((props: TokenProviderValue) => ReactNode) | ReactNode;
+    /**
+     * Required when application is running as self-hosted.
      * It's used to perform a security check to test the validity of token against current organization.
      */
     organizationSlug?: string;
     /**
-     * Base domain to be used for Commerce Layer API requests (eg. `commercelayer.io`)
+     * Base domain to be used for Commerce Layer API requests (e.g. `commercelayer.io`)
      */
     domain?: string;
     /**
@@ -53,19 +60,11 @@ export interface TokenProviderProps {
      * Element to display in case of invalid token
      */
     errorElement?: ReactNode;
-    /**
-     * skip domain slug validation when is dev mode
-     */
-    devMode: boolean;
     /**
      * Optional. In case you already have an access token, this will skip the retrieval of token from URL or localStorage.
      * When undefined (default scenario), token is expected to be retrieved from `?accessToken=xxxx` query string or localStorage (in this order).
      */
     accessToken?: string;
-    /**
-     * Entire app content
-     */
-    children: ((props: TokenProviderValue) => ReactNode) | ReactNode;
 }
 export declare const AuthContext: import("react").Context<TokenProviderValue>;
 export declare const useTokenProvider: () => TokenProviderValue;