@shipengine/elements 2.3.1 → 2.4.0

package/components.js

@@ -1 +1 @@
-export{z as Actions,y as ActionsMenu,A as AddFundsForm,b as AutoFundingForm,B as ButtonGroup,C as CarrierBalance,d as CarrierConnectionCard,e as CarrierIcon,f as CollapsiblePanel,h as CopyButton,i as Cube,D as DateRangeCombo,j as DateRangeSelect,k as DisplayTerm,l as EditBillingForm,m as ErrorFallback,F as FieldLabel,n as FormPortal,o as FundAndPurchase,H as HistoryCard,p as HistoryCardExtension,I as InlineLabel,q as ItemsBreakdown,L as LinkAction,r as Loader,P as PoweredByShipEngine,R as RateDetails,S as Section,t as SettingsCard,u as SkeletonCarrierRow,v as Spacer,w as Spread,T as Tabs,V as VatForm,W as WalletCard,x as WarehouseForm,c as autoFundingSchema,g as getAddFundsSchema,s as styles}from"./actions-menu.js";export{C as CarrierLogo}from"./carrier-logo.js";export{C as CellFormattedDate,D as Drawer,G as GridController,P as Pager,S as SuspendText,u as usePager}from"./suspend-text.js";export{f as Field,S as StoryNotes}from"./story-notes.js";export{P as Portal}from"./use-toggle.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"./address.js";import"@emotion/react/jsx-runtime";import"date-fns/isToday";import"@shipengine/giger";import"react";import"react-hook-form";import"react-i18next";import"./vat.js";import"lodash/get";import"@hookform/resolvers/zod";import"zod";import"@emotion/react";import"@shipengine/giger-theme";import"lodash/isEqual";import"./money.js";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"lodash/omit";import"card-validator";import"./zod.js";import"react-dom";
+export{z as Actions,y as ActionsMenu,A as AddFundsForm,b as AutoFundingForm,B as ButtonGroup,C as CarrierBalance,d as CarrierConnectionCard,e as CarrierIcon,f as CollapsiblePanel,h as CopyButton,i as Cube,D as DateRangeCombo,j as DateRangeSelect,k as DisplayTerm,l as EditBillingForm,m as ErrorFallback,F as FieldLabel,n as FormPortal,o as FundAndPurchase,H as HistoryCard,p as HistoryCardExtension,I as InlineLabel,q as ItemsBreakdown,L as LinkAction,r as Loader,P as PoweredByShipEngine,R as RateDetails,S as Section,t as SettingsCard,u as SkeletonCarrierRow,v as Spacer,w as Spread,T as Tabs,V as VatForm,W as WalletCard,x as WarehouseForm,c as autoFundingSchema,g as getAddFundsSchema,s as styles}from"./actions-menu.js";export{C as CarrierLogo}from"./carrier-logo.js";export{C as CellFormattedDate,D as Drawer,G as GridController,b as GridFilters,a as GridFooter,P as Pager,u as usePager}from"./usePager.js";export{f as Field,S as StoryNotes,a as SuspendText}from"./suspend-text.js";export{P as Portal}from"./use-toggle.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"./address.js";import"@emotion/react/jsx-runtime";import"date-fns/isToday";import"@shipengine/giger";import"react";import"react-hook-form";import"react-i18next";import"./vat.js";import"lodash/get";import"@hookform/resolvers/zod";import"zod";import"@emotion/react";import"@shipengine/giger-theme";import"lodash/isEqual";import"./money.js";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"lodash/omit";import"card-validator";import"./zod.js";import"react-use";import"react-dom";

package/elements.js

@@ -1 +1 @@
-export{e as LabelLayout,l as LabelsGrid,m as ManageCarriers,b as ManageExternalCarriers,d as ManageFunding,a as ManageWarehouses,p as PaymentMethodSettings,s as ShipmentsGrid,t as ThemeCreator,T as ThemeCreatorProvider,f as TransactionHistory,c as UnitSettings,u as useThemeCreator}from"./transaction-history-element.js";export{a as CarrierServices,p as PurchaseLabel,s as ShipmentSummary,v as VoidLabel}from"./use-unit-settings.js";import"@emotion/react/jsx-runtime";import"./actions-menu.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"./address.js";import"date-fns/isToday";import"@shipengine/giger";import"react";import"react-hook-form";import"react-i18next";import"./vat.js";import"lodash/get";import"@hookform/resolvers/zod";import"zod";import"@emotion/react";import"@shipengine/giger-theme";import"./use-toggle.js";import"lodash/isEqual";import"lodash/omit";import"react-dom";import"./money.js";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"card-validator";import"./zod.js";import"./suspend-text.js";import"@tanstack/react-query";import"./use-scrub-errors.js";import"./shipment.js";import"lodash/orderBy";import"lodash/merge";import"lodash/mergeWith";import"./warehouses.js";import"axios";import"@shipengine/js-api";import"@rjsf/core";import"@rjsf/validator-ajv8";import"lodash/camelCase";import"use-debounce";import"classnames";import"i18next";import"i18next-browser-languagedetector";import"@emotion/cache";import"stylis";
+export{e as LabelLayout,l as LabelsGrid,m as ManageCarriers,b as ManageExternalCarriers,d as ManageFunding,a as ManageWarehouses,p as PaymentMethodSettings,s as ShipmentsGrid,t as ThemeCreator,T as ThemeCreatorProvider,f as TransactionHistory,c as UnitSettings,u as useThemeCreator}from"./transaction-history-element.js";export{a as CarrierServices,p as PurchaseLabel,s as ShipmentSummary,v as VoidLabel}from"./use-unit-settings.js";import"@emotion/react/jsx-runtime";import"./actions-menu.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"./address.js";import"date-fns/isToday";import"@shipengine/giger";import"react";import"react-hook-form";import"react-i18next";import"./vat.js";import"lodash/get";import"@hookform/resolvers/zod";import"zod";import"@emotion/react";import"@shipengine/giger-theme";import"./use-toggle.js";import"lodash/isEqual";import"lodash/omit";import"react-dom";import"./money.js";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"card-validator";import"./zod.js";import"./use-get-service-name.js";import"./usePager.js";import"react-use";import"@tanstack/react-query";import"./use-scrub-errors.js";import"./shipment.js";import"lodash/orderBy";import"lodash/merge";import"lodash/mergeWith";import"./warehouses.js";import"axios";import"@shipengine/js-api";import"@rjsf/core";import"@rjsf/validator-ajv8";import"lodash/camelCase";import"use-debounce";import"classnames";import"i18next";import"i18next-browser-languagedetector";import"@emotion/cache";import"stylis";

package/hooks.js

@@ -1 +1 @@
-export{R as RootPortalProvider,b as useAddressValidation,u as useCountryCodeOptions,c as useRootPortal,a as useStateCodeOptions,d as useToggle}from"./use-toggle.js";export{P as PudoType,l as useBlackboxDetection,u as useConfirmationOptions,a as useCustomsContentsOptions,b as useCustomsNonDeliveryOptions,c as useDateRangeOptions,d as useInsuranceProviderOptions,m as useNestedForm,e as usePackageOptions,f as useRateOptions,n as useRunOnceOnTrue,o as useScrubErrors,g as useServiceCodeOptions,k as useServicePoints,h as useShipmentMetadata,i as useShippingPresetsOptions,j as useWarehouseOptions}from"./use-scrub-errors.js";export{P as PageLayoutProvider,u as useExpirationMonthOptions,a as useHelpers,b as usePageLayout}from"./use-page-layout.js";import"react";import"./address.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"lodash/isEqual";import"lodash/omit";import"react-dom";import"@emotion/react/jsx-runtime";import"react-i18next";import"./shipment.js";import"lodash/orderBy";import"@shipengine/giger";import"@emotion/react";import"js-base64";import"./checks.js";
+export{R as RootPortalProvider,b as useAddressValidation,u as useCountryCodeOptions,c as useRootPortal,a as useStateCodeOptions,d as useToggle}from"./use-toggle.js";export{P as PudoType,l as useBlackboxDetection,u as useConfirmationOptions,a as useCustomsContentsOptions,b as useCustomsNonDeliveryOptions,c as useDateRangeOptions,d as useInsuranceProviderOptions,m as useNestedForm,e as usePackageOptions,f as useRateOptions,n as useRunOnceOnTrue,o as useScrubErrors,g as useServiceCodeOptions,k as useServicePoints,h as useShipmentMetadata,i as useShippingPresetsOptions,j as useWarehouseOptions}from"./use-scrub-errors.js";export{u as useGetServiceName}from"./use-get-service-name.js";export{P as PageLayoutProvider,u as useExpirationMonthOptions,a as useHelpers,b as usePageLayout}from"./use-page-layout.js";import"react";import"./address.js";import"./carrier.js";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"humps";import"@shipengine/react-api";import"lodash/isEqual";import"lodash/omit";import"react-dom";import"@emotion/react/jsx-runtime";import"react-i18next";import"./shipment.js";import"lodash/orderBy";import"@shipengine/giger";import"@emotion/react";import"js-base64";import"./checks.js";

package/index.js

@@ -1 +1 @@
-import{E as X,a as _}from"./actions-menu.js";export{z as Actions,y as ActionsMenu,A as AddFundsForm,b as AutoFundingForm,B as ButtonGroup,C as CarrierBalance,d as CarrierConnectionCard,e as CarrierIcon,f as CollapsiblePanel,h as CopyButton,i as Cube,D as DateRangeCombo,j as DateRangeSelect,k as DisplayTerm,l as EditBillingForm,a as ElementsContext,E as ElementsContextProvider,m as ErrorFallback,F as FieldLabel,n as FormPortal,o as FundAndPurchase,H as HistoryCard,p as HistoryCardExtension,I as InlineLabel,q as ItemsBreakdown,L as LinkAction,r as Loader,P as PoweredByShipEngine,R as RateDetails,S as Section,t as SettingsCard,u as SkeletonCarrierRow,v as Spacer,w as Spread,T as Tabs,V as VatForm,W as WalletCard,x as WarehouseForm,c as autoFundingSchema,g as getAddFundsSchema,s as styles,G as useElements}from"./actions-menu.js";export{C as CarrierLogo}from"./carrier-logo.js";export{C as CellFormattedDate,D as Drawer,G as GridController,P as Pager,S as SuspendText,u as usePager}from"./suspend-text.js";export{f as Field,S as StoryNotes}from"./story-notes.js";import{R as Y}from"./use-toggle.js";export{P as Portal,R as RootPortalProvider,b as useAddressValidation,u as useCountryCodeOptions,c as useRootPortal,a as useStateCodeOptions,d as useToggle}from"./use-toggle.js";export{C as Country,U as UsState,d as UsaCity,c as countries,a as countryCodes,e as euCountryCodes,p as postalCodeRegex,f as usCities,b as usStateCodes,u as usStates}from"./address.js";export{a as CarrierServices,b as ConnectExternalCarrier,p as PurchaseLabel,s as ShipmentSummary,v as VoidLabel,c as createElement}from"./use-unit-settings.js";export{e as LabelLayout,l as LabelsGrid,m as ManageCarriers,b as ManageExternalCarriers,d as ManageFunding,a as ManageWarehouses,p as PaymentMethodSettings,s as ShipmentsGrid,t as ThemeCreator,T as ThemeCreatorProvider,f as TransactionHistory,c as UnitSettings,u as useThemeCreator}from"./transaction-history-element.js";export{e as extendZod}from"./zod.js";export{P as PudoType,l as useBlackboxDetection,u as useConfirmationOptions,a as useCustomsContentsOptions,b as useCustomsNonDeliveryOptions,c as useDateRangeOptions,d as useInsuranceProviderOptions,m as useNestedForm,e as usePackageOptions,f as useRateOptions,n as useRunOnceOnTrue,o as useScrubErrors,g as useServiceCodeOptions,k as useServicePoints,h as useShipmentMetadata,i as useShippingPresetsOptions,j as useWarehouseOptions}from"./use-scrub-errors.js";export{P as PageLayoutProvider,u as useExpirationMonthOptions,a as useHelpers,b as usePageLayout}from"./use-page-layout.js";export{m as moneySchema}from"./money.js";export{p as phoneSchema,a as phoneSchemaUnvalidated}from"./phone.js";export{a as assert,r as raise}from"./assertions.js";export{i as isOnboarded}from"./checks.js";export{b as convertDimensions,c as createDictionary,f as formatDimensions,h as getCancelledShipment,d as getIsCustomsRequiredForShipment,g as getIsInternationalShipment,e as getPendingShipment,j as getShipmentByStatus,a as isCollectionService,i as isPudoEligibleRate,m as moveCustomsItemsToProducts}from"./shipment.js";import{_ as Z}from"./carrier.js";export{L as addEmailToValidation,t as addSpaceBetweenWords,w as calculateTotal,k as capitalizeFirstLetter,l as capitalizeFirstLetterOfEachWord,u as currencySymbol,e as daysAfter,S as filterFundingSourceCarriers,a as findDateLocale,b as formatByDateAndLocale,x as formatCreditCardNumber,f as formatDate,c as formatDateDDMMYY,d as formatDateDDMMYYYY,y as formatExpiration,v as formatMoney,O as getCarrierIdByCarrierCode,z as getCurrencyFromString,A as getCurrencySymbolFromString,h as getExpirationYears,P as getLogoOrIconByCarrierCode,B as getRateRequiresAcknowledgement,j as getRelativeDates,C as getTotalRateAmount,g as getlocaleDateStringFormat,E as isDomesticAddress,K as isEmptyAddress,Q as isGlobalPostEligible,F as isMilitaryAddress,i as isNowOrInTheFuture,I as isPoBox,J as isPoBoxAddress,R as isSendleEligible,G as isUnitedStatesTerritory,H as isUnsupportedByUps,N as isUpsCarrier,M as isUspsCarrier,m as mostRecent,n as nextDayCutoff,o as omitTime,D as overrideCarrierCodes,p as parseLocaleDate,q as pascalize,r as replaceSpacesWithDashes,s as sortByCreationDate}from"./carrier.js";export{k as convertDecimalWeightToFractionalWeight,j as convertFractionalWeightToDecimalWeight,h as convertPoundsAndOuncesToOunces,l as convertWeight,c as createCodedErrors,m as formatFractionalWeight,g as getCustomsFromSalesOrder,o as getDefaultWarehouse,b as getIsCustomsRequiredForSalesOrder,d as getRequestedServices,e as getSalesOrderItemsFromSalesOrderOrShipment,f as isDecimalWeight,n as isFlatRatePackageCode,i as isMetricWeightUnit,a as throwAny,t as throwJoinedMessages}from"./warehouses.js";import{g as $,d as ee}from"./vat.js";export{N as NO_VAT_COUNTRIES,c as aggregateRateDetailItems,e as calculateRateDetailBreakdown,h as createStyles,d as deepMergeFeatures,j as errorMap,f as featureFlagComponentNameLookup,a as formLogger,g as getDefaultFeatures,k as getIsVatRequired,i as isObject,b as isString,t as trackingStatusFormatter,v as validationResolver}from"./vat.js";export{a as AccountSettings,l as LabelWorkflow,o as Onboarding}from"./wallet-form.js";import{jsx as ae}from"@emotion/react/jsx-runtime";import{GigerProvider as te,GigerTestProvider as re}from"@shipengine/giger";import{Theme as oe}from"@shipengine/giger-theme";import{ShipEngine as se}from"@shipengine/react-api";import ie from"axios";import{useCallback as ne,useMemo as le}from"react";import"date-fns/isToday";import"react-hook-form";import"react-i18next";import"@emotion/react";import"lodash/isEqual";import"zod";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"lodash/omit";import"card-validator";import"react-dom";import"@tanstack/react-query";import"lodash/merge";import"lodash/mergeWith";import"humps";import"@shipengine/js-api";import"@rjsf/core";import"@rjsf/validator-ajv8";import"lodash/camelCase";import"use-debounce";import"classnames";import"i18next";import"i18next-browser-languagedetector";import"@emotion/cache";import"stylis";import"lodash/orderBy";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"lodash/get";import"@hookform/resolvers/zod";var pe={fallback:{borderRadius:{L:"16px",M:"8px",S:"4px",XL:"32px",XS:"2px"},breakPoints:{desktop:1280,mobileLarge:480,tablet:768,tabletLarge:960},card:{borderRadius:{desktop:"8px",mobile:"4px",tablet:"8px"}},components:{Button:{borderRadius:"4px"},Checkbox:{borderRadius:"2px",square:!1},Chip:{backgroundColor:"#f4f4f4",border:"none",borderRadius:"16px",color:"#706f6f",fontWeight:600,isSelected:{backgroundColor:"#EDEDED",border:"none",color:"#7A7A7A"},padding:"4px 16px"},Dialog:{action:{justifyContent:"center"},content:{padding:24,textAlign:"center"},dialog:{backgroundColor:"rgba(0, 0, 0, 0.26)",borderRadius:"4px"},header:{borderBottom:"2px solid #d3d3d3",padding:24,titleColor:"#616161"}},Field:{color:"#373737",fontWeight:700,placeholder:{fontWeight:700}},FieldContainer:{borderRadius:"4px"},Link:{activeColor:"#787878",defaultColor:"#616161",hoverColor:"#303030",isDark:{activeColor:"#787878",defaultColor:"#fff",hoverColor:"#fff",visitedColor:"#fff"},visitedColor:"#303030"},Table:{border:"none",borderRadius:"4px",boxShadow:"0 0 12px rgba(0, 0, 0, 0.1)"},Typography:{body1:{fontSize:"16px",fontWeight:400,letterSpacing:0,lineHeight:"24px"},body2:{fontSize:"14px",fontWeight:400,letterSpacing:3,lineHeight:"20px"},heading1:{fontSize:"48px",fontWeight:700,letterSpacing:0,lineHeight:"72px"},heading2:{fontSize:"32px",fontWeight:700,letterSpacing:1,lineHeight:"48px"},heading3:{fontSize:"24px",fontWeight:700,letterSpacing:3,lineHeight:"48px"},heading4:{fontSize:"20px",fontWeight:700,letterSpacing:3,lineHeight:"32px"},heading5:{fontSize:"18px",fontWeight:700,letterSpacing:3,lineHeight:"28px"},heading6:{fontSize:"16px",fontWeight:700,letterSpacing:3,lineHeight:"24px"},small:{fontSize:"12px",fontWeight:400,letterSpacing:5,lineHeight:"20px"},subtitle1:{fontSize:"16px",fontWeight:600,letterSpacing:3,lineHeight:"24px"},subtitle2:{fontSize:"14px",fontWeight:600,letterSpacing:5,lineHeight:"20px"}}},defaultFontFamily:"Arial",elevations:{above:{boxShadow:"0 0 12px rgba(0, 0, 0, 0.1)",zIndex:1e3},backdrop:{boxShadow:"none",zIndex:1007},flat1:{boxShadow:"0 2px 2px rgba(0, 0, 0, 0.1)",zIndex:1},flat2:{boxShadow:"0 2px 2px rgba(0, 0, 0, 0.1)",zIndex:1e3},overlay1:{boxShadow:"0 0 24px rgba(0, 0, 0, 0.1)",zIndex:1006},overlay2:{boxShadow:"0 0 24px rgba(0, 0, 0, 0.1)",zIndex:1008},popout1:{boxShadow:"0 4px 16px rgba(0, 0, 0, 0.1)",zIndex:1004},popout2:{boxShadow:"0 4px 16px rgba(0, 0, 0, 0.1)",zIndex:1005},raised:{boxShadow:"0 8px 8px rgba(0, 0, 0, 0.1)",zIndex:1002},raisedInverted1:{boxShadow:"0 -8px 8px rgba(0, 0, 0, 0.1)",zIndex:1002},raisedInverted2:{boxShadow:"0 -8px 8px rgba(0, 0, 0, 0.1)",zIndex:1003},sticky:{boxShadow:"none",zIndex:1001}},fontFaces:[],grid:{desktop:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},desktopLarge:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},mobile:{columns:4,gutter:16,horizontalSpace:16,verticalSpace:16},mobileLarge:{columns:4,gutter:16,horizontalSpace:16,verticalSpace:16},tablet:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},tabletLarge:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24}},iconSize:{extra_large:"48px",large:"32px",medium:"20px",regular:"24px",small:"16px"},palette:{alert:{light:"#ffe7ca",main:"#725200"},black:"#000",dataVisualization:{highContrast:{blue:"#3970C1",blueDark:"#002039",coral:"#F95D6A",cyan:"#45CEE0",green:"#B3D849",orange:"#FFA600",orangeDark:"#FF7C43",pink:"#D12771",purple:"#A05195",purpleDark:"#665191"},lowContrast:{blue:"#96B3DE",blueDark:"#5283AB",coral:"#FCA6AD",cyan:"#BAE6FF",green:"#DEF895",orange:"#FDDFA5",orangeDark:"#FCC2A9",pink:"#E995BA",purple:"#D4BBFF",purpleDark:"#B1A2D0"}},error:{light:"#fee5e4",main:"#a72514"},gray:{dark:"#373737",light:"#d3d3d3",main:"#706f6f",megaLight:"#f4f4f4",ultraLight:"#f4f4f4"},info:{light:"#dbedfd",main:"#195f7f"},primary:{dark:"#626262",light:"#D6D6D6",main:"#7A7A7A",ultraLight:"#EDEDED"},secondary:{dark:"#303030",light:"#787878",main:"#616161",ultraLight:"#F4F4F4"},success:{light:"#dcfddb",main:"#286327"},white:"#fff"},spacingBase:8,typography:{fontSize:{L:"18px",M:"16px",S:"14px",XL:"20px",XS:"12px",XXL:"24px",XXS:"10px",XXXL:"32px",XXXXL:"48px"},fontWeight:{bold:700,light:200,normal:400,semibold:600},letterSpacing:{L:3,M:1,S:0,XL:5,XXL:8,XXXL:12},lineHeight:{L:"28px",M:"24px",S:"20px",XL:"32px",XXL:"48px",XXXL:"72px"}}}};const de=({baseURL:e="https://elements.shipengine.com",cdnURL:a="https://cdn.packlink.com",children:t,container:r,features:o,getToken:s,headers:i,locale:n,onApiError:l,onError:p=(()=>{}),scope:d="lmnt",themeConfig:c,defaultQueryClientOptions:g})=>{const m=(({cdnURL:e})=>ne((a=>Z(void 0,void 0,void 0,(function*(){return(yield ie.get(`/brand/fallback/icons/${a.toLowerCase()}.svg`,{baseURL:e,responseType:"json"})).data}))),[e]))({cdnURL:a}),u=new oe(null!=c?c:pe.fallback),h={baseURL:e,cdnURL:a,container:r,features:o,getToken:s,locale:n,onError:p,scope:d,theme:u};return ae(X,Object.assign({},h,{children:ae(te,Object.assign({cdnUrl:a,reference:d||void 0,resolveIcon:m,theme:u},{children:ae(se,Object.assign({baseURL:e,defaultQueryClientOptions:g,getToken:s,headers:i,onApiError:l},{children:ae(Y,{children:t})}))}))}))},ce=({baseURL:e,children:a,features:t})=>{const r=le((()=>new oe),[]),o=$(["globalFeatures"]),s=ne((()=>"none"),[]),i={baseURL:e,cdnURL:"mockCdnUrl",getFeatures:e=>{var a;return ee(null!==(a=$([e]))&&void 0!==a?a:{},null==t?void 0:t[e])},getToken:s,globalFeatures:Object.assign(Object.assign({enabledExternalCarriers:["apc","asendia","better_trucks","canpar","chronopost","couriers_please","courierpost","dpd","hermes_germany","intelliquick_delivery","lso","ontrac","seko","ups","yodel"]},o),t.globalFeatures),onError:()=>{},scope:"lmnt",theme:r};return ae(_.Provider,Object.assign({value:i},{children:ae(re,Object.assign({theme:r},{children:ae(se,Object.assign({baseURL:e,getToken:s},{children:a}))}))}))};export{de as ElementsProvider,ce as ElementsTestProvider};
+import{E as X,a as _}from"./actions-menu.js";export{z as Actions,y as ActionsMenu,A as AddFundsForm,b as AutoFundingForm,B as ButtonGroup,C as CarrierBalance,d as CarrierConnectionCard,e as CarrierIcon,f as CollapsiblePanel,h as CopyButton,i as Cube,D as DateRangeCombo,j as DateRangeSelect,k as DisplayTerm,l as EditBillingForm,a as ElementsContext,E as ElementsContextProvider,m as ErrorFallback,F as FieldLabel,n as FormPortal,o as FundAndPurchase,H as HistoryCard,p as HistoryCardExtension,I as InlineLabel,q as ItemsBreakdown,L as LinkAction,r as Loader,P as PoweredByShipEngine,R as RateDetails,S as Section,t as SettingsCard,u as SkeletonCarrierRow,v as Spacer,w as Spread,T as Tabs,V as VatForm,W as WalletCard,x as WarehouseForm,c as autoFundingSchema,g as getAddFundsSchema,s as styles,G as useElements}from"./actions-menu.js";export{C as CarrierLogo}from"./carrier-logo.js";export{C as CellFormattedDate,D as Drawer,G as GridController,b as GridFilters,a as GridFooter,P as Pager,u as usePager}from"./usePager.js";export{f as Field,S as StoryNotes,a as SuspendText}from"./suspend-text.js";import{R as Y}from"./use-toggle.js";export{P as Portal,R as RootPortalProvider,b as useAddressValidation,u as useCountryCodeOptions,c as useRootPortal,a as useStateCodeOptions,d as useToggle}from"./use-toggle.js";export{C as Country,U as UsState,d as UsaCity,c as countries,a as countryCodes,e as euCountryCodes,p as postalCodeRegex,f as usCities,b as usStateCodes,u as usStates}from"./address.js";export{a as CarrierServices,b as ConnectExternalCarrier,p as PurchaseLabel,s as ShipmentSummary,v as VoidLabel,c as createElement}from"./use-unit-settings.js";export{e as LabelLayout,l as LabelsGrid,m as ManageCarriers,b as ManageExternalCarriers,d as ManageFunding,a as ManageWarehouses,p as PaymentMethodSettings,s as ShipmentsGrid,t as ThemeCreator,T as ThemeCreatorProvider,f as TransactionHistory,c as UnitSettings,u as useThemeCreator}from"./transaction-history-element.js";export{e as extendZod}from"./zod.js";export{P as PudoType,l as useBlackboxDetection,u as useConfirmationOptions,a as useCustomsContentsOptions,b as useCustomsNonDeliveryOptions,c as useDateRangeOptions,d as useInsuranceProviderOptions,m as useNestedForm,e as usePackageOptions,f as useRateOptions,n as useRunOnceOnTrue,o as useScrubErrors,g as useServiceCodeOptions,k as useServicePoints,h as useShipmentMetadata,i as useShippingPresetsOptions,j as useWarehouseOptions}from"./use-scrub-errors.js";export{P as PageLayoutProvider,u as useExpirationMonthOptions,a as useHelpers,b as usePageLayout}from"./use-page-layout.js";export{u as useGetServiceName}from"./use-get-service-name.js";export{m as moneySchema}from"./money.js";export{p as phoneSchema,a as phoneSchemaUnvalidated}from"./phone.js";export{a as assert,r as raise}from"./assertions.js";export{i as isOnboarded}from"./checks.js";export{b as convertDimensions,c as createDictionary,f as formatDimensions,h as getCancelledShipment,d as getIsCustomsRequiredForShipment,g as getIsInternationalShipment,e as getPendingShipment,j as getShipmentByStatus,a as isCollectionService,i as isPudoEligibleRate,m as moveCustomsItemsToProducts}from"./shipment.js";import{_ as Z}from"./carrier.js";export{L as addEmailToValidation,t as addSpaceBetweenWords,w as calculateTotal,k as capitalizeFirstLetter,l as capitalizeFirstLetterOfEachWord,u as currencySymbol,e as daysAfter,S as filterFundingSourceCarriers,a as findDateLocale,b as formatByDateAndLocale,x as formatCreditCardNumber,f as formatDate,c as formatDateDDMMYY,d as formatDateDDMMYYYY,y as formatExpiration,v as formatMoney,O as getCarrierIdByCarrierCode,z as getCurrencyFromString,A as getCurrencySymbolFromString,h as getExpirationYears,P as getLogoOrIconByCarrierCode,B as getRateRequiresAcknowledgement,j as getRelativeDates,C as getTotalRateAmount,g as getlocaleDateStringFormat,E as isDomesticAddress,K as isEmptyAddress,Q as isGlobalPostEligible,F as isMilitaryAddress,i as isNowOrInTheFuture,I as isPoBox,J as isPoBoxAddress,R as isSendleEligible,G as isUnitedStatesTerritory,H as isUnsupportedByUps,N as isUpsCarrier,M as isUspsCarrier,m as mostRecent,n as nextDayCutoff,o as omitTime,D as overrideCarrierCodes,p as parseLocaleDate,q as pascalize,r as replaceSpacesWithDashes,s as sortByCreationDate}from"./carrier.js";export{k as convertDecimalWeightToFractionalWeight,j as convertFractionalWeightToDecimalWeight,h as convertPoundsAndOuncesToOunces,l as convertWeight,c as createCodedErrors,m as formatFractionalWeight,g as getCustomsFromSalesOrder,o as getDefaultWarehouse,b as getIsCustomsRequiredForSalesOrder,d as getRequestedServices,e as getSalesOrderItemsFromSalesOrderOrShipment,f as isDecimalWeight,n as isFlatRatePackageCode,i as isMetricWeightUnit,a as throwAny,t as throwJoinedMessages}from"./warehouses.js";import{g as $,d as ee}from"./vat.js";export{N as NO_VAT_COUNTRIES,c as aggregateRateDetailItems,e as calculateRateDetailBreakdown,h as createStyles,d as deepMergeFeatures,j as errorMap,f as featureFlagComponentNameLookup,a as formLogger,g as getDefaultFeatures,k as getIsVatRequired,i as isObject,b as isString,t as trackingStatusFormatter,v as validationResolver}from"./vat.js";export{a as AccountSettings,l as LabelWorkflow,o as Onboarding}from"./wallet-form.js";import{jsx as ae}from"@emotion/react/jsx-runtime";import{GigerProvider as te,GigerTestProvider as re}from"@shipengine/giger";import{Theme as se}from"@shipengine/giger-theme";import{ShipEngine as oe}from"@shipengine/react-api";import ie from"axios";import{useCallback as ne,useMemo as le}from"react";import"date-fns/isToday";import"react-hook-form";import"react-i18next";import"@emotion/react";import"lodash/isEqual";import"zod";import"copy-to-clipboard";import"js-base64";import"libphonenumber-js/min";import"lodash/omit";import"card-validator";import"react-use";import"react-dom";import"@tanstack/react-query";import"lodash/merge";import"lodash/mergeWith";import"humps";import"@shipengine/js-api";import"@rjsf/core";import"@rjsf/validator-ajv8";import"lodash/camelCase";import"use-debounce";import"classnames";import"i18next";import"i18next-browser-languagedetector";import"@emotion/cache";import"stylis";import"lodash/orderBy";import"date-fns/format";import"date-fns/locale";import"date-fns/parse";import"lodash/get";import"@hookform/resolvers/zod";var pe={fallback:{borderRadius:{L:"16px",M:"8px",S:"4px",XL:"32px",XS:"2px"},breakPoints:{desktop:1280,mobileLarge:480,tablet:768,tabletLarge:960},card:{borderRadius:{desktop:"8px",mobile:"4px",tablet:"8px"}},components:{Button:{borderRadius:"4px"},Checkbox:{borderRadius:"2px",square:!1},Chip:{backgroundColor:"#f4f4f4",border:"none",borderRadius:"16px",color:"#706f6f",fontWeight:600,isSelected:{backgroundColor:"#EDEDED",border:"none",color:"#7A7A7A"},padding:"4px 16px"},Dialog:{action:{justifyContent:"center"},content:{padding:24,textAlign:"center"},dialog:{backgroundColor:"rgba(0, 0, 0, 0.26)",borderRadius:"4px"},header:{borderBottom:"2px solid #d3d3d3",padding:24,titleColor:"#616161"}},Field:{color:"#373737",fontWeight:700,placeholder:{fontWeight:700}},FieldContainer:{borderRadius:"4px"},Link:{activeColor:"#787878",defaultColor:"#616161",hoverColor:"#303030",isDark:{activeColor:"#787878",defaultColor:"#fff",hoverColor:"#fff",visitedColor:"#fff"},visitedColor:"#303030"},Table:{border:"none",borderRadius:"4px",boxShadow:"0 0 12px rgba(0, 0, 0, 0.1)"},Typography:{body1:{fontSize:"16px",fontWeight:400,letterSpacing:0,lineHeight:"24px"},body2:{fontSize:"14px",fontWeight:400,letterSpacing:3,lineHeight:"20px"},heading1:{fontSize:"48px",fontWeight:700,letterSpacing:0,lineHeight:"72px"},heading2:{fontSize:"32px",fontWeight:700,letterSpacing:1,lineHeight:"48px"},heading3:{fontSize:"24px",fontWeight:700,letterSpacing:3,lineHeight:"48px"},heading4:{fontSize:"20px",fontWeight:700,letterSpacing:3,lineHeight:"32px"},heading5:{fontSize:"18px",fontWeight:700,letterSpacing:3,lineHeight:"28px"},heading6:{fontSize:"16px",fontWeight:700,letterSpacing:3,lineHeight:"24px"},small:{fontSize:"12px",fontWeight:400,letterSpacing:5,lineHeight:"20px"},subtitle1:{fontSize:"16px",fontWeight:600,letterSpacing:3,lineHeight:"24px"},subtitle2:{fontSize:"14px",fontWeight:600,letterSpacing:5,lineHeight:"20px"}}},defaultFontFamily:"Arial",elevations:{above:{boxShadow:"0 0 12px rgba(0, 0, 0, 0.1)",zIndex:1e3},backdrop:{boxShadow:"none",zIndex:1007},flat1:{boxShadow:"0 2px 2px rgba(0, 0, 0, 0.1)",zIndex:1},flat2:{boxShadow:"0 2px 2px rgba(0, 0, 0, 0.1)",zIndex:1e3},overlay1:{boxShadow:"0 0 24px rgba(0, 0, 0, 0.1)",zIndex:1006},overlay2:{boxShadow:"0 0 24px rgba(0, 0, 0, 0.1)",zIndex:1008},popout1:{boxShadow:"0 4px 16px rgba(0, 0, 0, 0.1)",zIndex:1004},popout2:{boxShadow:"0 4px 16px rgba(0, 0, 0, 0.1)",zIndex:1005},raised:{boxShadow:"0 8px 8px rgba(0, 0, 0, 0.1)",zIndex:1002},raisedInverted1:{boxShadow:"0 -8px 8px rgba(0, 0, 0, 0.1)",zIndex:1002},raisedInverted2:{boxShadow:"0 -8px 8px rgba(0, 0, 0, 0.1)",zIndex:1003},sticky:{boxShadow:"none",zIndex:1001}},fontFaces:[],grid:{desktop:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},desktopLarge:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},mobile:{columns:4,gutter:16,horizontalSpace:16,verticalSpace:16},mobileLarge:{columns:4,gutter:16,horizontalSpace:16,verticalSpace:16},tablet:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24},tabletLarge:{columns:12,gutter:24,horizontalSpace:16,verticalSpace:24}},iconSize:{extra_large:"48px",large:"32px",medium:"20px",regular:"24px",small:"16px"},palette:{alert:{light:"#ffe7ca",main:"#725200"},black:"#000",dataVisualization:{highContrast:{blue:"#3970C1",blueDark:"#002039",coral:"#F95D6A",cyan:"#45CEE0",green:"#B3D849",orange:"#FFA600",orangeDark:"#FF7C43",pink:"#D12771",purple:"#A05195",purpleDark:"#665191"},lowContrast:{blue:"#96B3DE",blueDark:"#5283AB",coral:"#FCA6AD",cyan:"#BAE6FF",green:"#DEF895",orange:"#FDDFA5",orangeDark:"#FCC2A9",pink:"#E995BA",purple:"#D4BBFF",purpleDark:"#B1A2D0"}},error:{light:"#fee5e4",main:"#a72514"},gray:{dark:"#373737",light:"#d3d3d3",main:"#706f6f",megaLight:"#f4f4f4",ultraLight:"#f4f4f4"},info:{light:"#dbedfd",main:"#195f7f"},primary:{dark:"#626262",light:"#D6D6D6",main:"#7A7A7A",ultraLight:"#EDEDED"},secondary:{dark:"#303030",light:"#787878",main:"#616161",ultraLight:"#F4F4F4"},success:{light:"#dcfddb",main:"#286327"},white:"#fff"},spacingBase:8,typography:{fontSize:{L:"18px",M:"16px",S:"14px",XL:"20px",XS:"12px",XXL:"24px",XXS:"10px",XXXL:"32px",XXXXL:"48px"},fontWeight:{bold:700,light:200,normal:400,semibold:600},letterSpacing:{L:3,M:1,S:0,XL:5,XXL:8,XXXL:12},lineHeight:{L:"28px",M:"24px",S:"20px",XL:"32px",XXL:"48px",XXXL:"72px"}}}};const de=({baseURL:e="https://elements.shipengine.com",cdnURL:a="https://cdn.packlink.com",children:t,container:r,features:s,getToken:o,headers:i,locale:n,onApiError:l,onError:p=(()=>{}),scope:d="lmnt",themeConfig:c,defaultQueryClientOptions:g})=>{const m=(({cdnURL:e})=>ne((a=>Z(void 0,void 0,void 0,(function*(){return(yield ie.get(`/brand/fallback/icons/${a.toLowerCase()}.svg`,{baseURL:e,responseType:"json"})).data}))),[e]))({cdnURL:a}),u=new se(null!=c?c:pe.fallback),h={baseURL:e,cdnURL:a,container:r,features:s,getToken:o,locale:n,onError:p,scope:d,theme:u};return ae(X,Object.assign({},h,{children:ae(te,Object.assign({cdnUrl:a,reference:d||void 0,resolveIcon:m,theme:u},{children:ae(oe,Object.assign({baseURL:e,defaultQueryClientOptions:g,getToken:o,headers:i,onApiError:l},{children:ae(Y,{children:t})}))}))}))},ce=({baseURL:e,children:a,features:t})=>{const r=le((()=>new se),[]),s=$(["globalFeatures"]),o=ne((()=>"none"),[]),i={baseURL:e,cdnURL:"mockCdnUrl",getFeatures:e=>{var a;return ee(null!==(a=$([e]))&&void 0!==a?a:{},null==t?void 0:t[e])},getToken:o,globalFeatures:Object.assign(Object.assign({enabledExternalCarriers:["apc","asendia","better_trucks","canpar","chronopost","couriers_please","courierpost","dpd","hermes_germany","intelliquick_delivery","lso","ontrac","seko","ups","yodel"]},s),t.globalFeatures),onError:()=>{},scope:"lmnt",theme:r};return ae(_.Provider,Object.assign({value:i},{children:ae(re,Object.assign({theme:r},{children:ae(oe,Object.assign({baseURL:e,getToken:o},{children:a}))}))}))};export{de as ElementsProvider,ce as ElementsTestProvider};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shipengine/elements",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "peerDependencies": {
     "@emotion/react": "11.x",
     "react-i18next": "11.x",
@@ -37,9 +37,10 @@
     "@rjsf/validator-ajv8": "5.16.1",
     "@shipengine/giger": "1.15.0",
     "@shipengine/giger-theme": "1.6.0",
-    "@shipengine/js-api": "1.30.2",
-    "@shipengine/react-api": "2.15.3",
+    "@shipengine/js-api": "2.0.1",
+    "@shipengine/react-api": "3.1.2",
     "@storybook/addons": "6.5.16",
+    "@storybook/api": "6.5.16",
     "@storybook/components": "7.0.0-rc.1",
     "@storybook/core-events": "7.0.0-rc.1",
     "@storybook/manager-api": "7.0.0-rc.1",
@@ -58,6 +59,7 @@
     "libphonenumber-js": "1.10.14",
     "lodash": "4.17.21",
     "react-hook-form": "7.40.0",
+    "react-use": "17.4.2",
     "rollup-plugin-copy": "3.4.0",
     "stylis": "4.1.3",
     "use-debounce": "10.0.0",

package/src/components/field/create-field-controller.d.ts

@@ -14,6 +14,7 @@ export type FieldControllerProps<NP, TFieldValues extends FieldValues = FieldVal
     inputOnly?: boolean;
     isOptional?: boolean;
     label: string;
+    labelPosition?: FieldLabelProps["position"];
     labelWeight?: FieldLabelProps["weight"];
     labelWidth?: FieldLabelProps["width"];
     nativeLabel?: boolean;
@@ -21,7 +22,7 @@ export type FieldControllerProps<NP, TFieldValues extends FieldValues = FieldVal
 type FieldControllerOptions = {
     inputOnly?: boolean;
 };
-export declare const createFieldController: <P>(options?: FieldControllerOptions) => <TFieldValues extends FieldValues = FieldValues, TName extends import("react-hook-form").Path<TFieldValues> = import("react-hook-form").Path<TFieldValues>>({ children, control, defaultValue, displayErrors, displayLabel, errors: errorsProp, hint, inputOnly, isOptional, label, labelInfo, labelWeight, labelWidth, name, nativeLabel, rules, shouldUnregister, subLabel, ...formInputProps }: FieldControllerProps<P, TFieldValues, TName>) => JSX.Element;
+export declare const createFieldController: <P>(options?: FieldControllerOptions) => <TFieldValues extends FieldValues = FieldValues, TName extends import("react-hook-form").Path<TFieldValues> = import("react-hook-form").Path<TFieldValues>>({ children, control, defaultValue, displayErrors, displayLabel, errors: errorsProp, hint, inputOnly, isOptional, label, labelInfo, labelWeight, labelWidth, labelPosition, name, nativeLabel, rules, shouldUnregister, subLabel, ...formInputProps }: FieldControllerProps<P, TFieldValues, TName>) => JSX.Element;
 export type ControlledFieldProps = Parameters<ControlledField>[0];
 export type ControlledField<NP = object, CP = object, OK extends string = ""> = <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(fieldProps: Omit<FieldControllerProps<NP, TFieldValues, TName>, "children" | OK> & CP) => JSX.Element;
 export {};

package/src/components/field-label/field-label.d.ts

@@ -8,6 +8,7 @@ export type FieldLabelProps = {
     children: React.ReactNode;
     label?: string;
     labelInfo?: React.ReactNode;
+    position?: "horizontal" | "vertical";
     subLabel?: string;
     weight?: "bold" | "normal";
     width?: string | number;
@@ -18,4 +19,4 @@ export type FieldLabelProps = {
  *
  * # Field Label Component
  */
-export declare const FieldLabel: ({ children, label, labelInfo, subLabel, weight, withInput, width, }: FieldLabelProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const FieldLabel: ({ children, label, labelInfo, subLabel, weight, withInput, position, width, }: FieldLabelProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/src/components/field-label/field-label.styles.d.ts

@@ -1,4 +1,20 @@
 export declare const styles: {
+    getLabel: ({ withInput, subLabel, width, isVertical, }: {
+        isVertical?: boolean | undefined;
+        subLabel?: string | undefined;
+        width?: string | number | undefined;
+        withInput?: boolean | undefined;
+    }) => (theme: import("@shipengine/giger-theme/dist/lib/Theme").Theme) => {
+        flexShrink: number;
+        paddingTop: number | undefined;
+        width: string | number;
+    };
+    getWrapper: (isVertical: boolean) => (theme: import("@shipengine/giger-theme/dist/lib/Theme").Theme) => {
+        flexDirection?: "column" | undefined;
+        gap: number;
+        display: "flex";
+        width: string;
+    };
     iconTooltip: (theme: import("@shipengine/giger-theme/dist/lib/Theme").Theme) => {
         color: string;
         marginLeft: number;

package/src/components/grid-controller/grid-controller.d.ts

@@ -1,14 +1,32 @@
 import { ReactNode } from "react";
-type ColumnProps<T> = {
+export type ColumnProps<T> = {
     headerContent: ReactNode;
     renderCellContent: (data: T) => ReactNode;
 };
+/**
+ * @internal
+ *
+ * # Grid Props
+ *
+ * @see {@link GridController | The `<GridController />` component}
+ */
 type GridProps<T extends object> = {
     columns: ColumnProps<T>[];
     data: T[];
+    emptyContent?: ReactNode;
+    filters?: ReactNode;
     footerContent?: ReactNode;
     onRowClick?: (data: T) => void;
     useCheckboxes?: boolean;
 };
-export declare const GridController: <T extends object>({ columns, data, footerContent, onRowClick, useCheckboxes, }: GridProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;
+/**
+ * @internal
+ *
+ * # Grid Controller
+ *
+ * - The `<GridController />` component is used to facilitate the display of data in a grid format.
+ *
+ * @see {@link GridProps | The props for the `<GridController />` component}
+ */
+export declare const GridController: <T extends object>({ columns, data, footerContent, onRowClick, useCheckboxes, filters, emptyContent, }: GridProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/src/components/grid-controller/grid-controller.styles.d.ts

@@ -1,11 +1,23 @@
 export declare const styles: {
-    checkboxHeader: (theme: import("@shipengine/giger-theme/dist/lib/Theme").Theme) => {
-        width: number;
+    getCheckboxHeader: (theme: any) => {
+        width: any;
     };
+    getFilters: (theme: any) => {
+        borderBottom: string;
+        padding: string;
+    };
+    getTableHeader: (theme: any) => {
+        background: any;
+    };
+    getWrapper: (theme: any) => any;
     table: {
-        "*": {
-            overflow: "hidden";
-            textOverflow: "clip !important";
-        };
+        tableLayout: "initial";
+    };
+    tableFooter: {
+        borderTop: string;
+        justifyContent: "space-between";
+    };
+    tableWrapper: {
+        border: string;
     };
 };

package/src/components/grid-controller/grid-footer.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+/**
+ * @internal
+ *
+ * # Grid Footer Props
+ *
+ * @see {@link GridFooter | The `<GridFooter />` component}
+ */
+interface GridFooterProps {
+    onPageChange: (nextPage: number) => void;
+    page: number;
+    pages: number;
+    pageSize: number;
+    showPagination: boolean;
+    total: number;
+}
+/**
+ * @internal
+ *
+ * # GridFooter
+ *
+ * - The `<GridFooter />` component that handle grid footer with pagination.
+ *
+ * @see {@link GridFooterProps | The props for the `<GridFooter />` component}
+ */
+export declare const GridFooter: ({ page, pages, pageSize, total, showPagination, onPageChange, }: GridFooterProps) => JSX.Element;
+export {};

package/src/components/grid-controller/index.d.ts

@@ -1,2 +1,4 @@
 export * from "./grid-controller";
 export * from "./cell-formatted-date";
+export * from "./grid-footer";
+export type { ColumnProps } from "./grid-controller";

package/src/components/grid-filters/grid-filters.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @internal
+ *
+ * # Grid Filters Props
+ *
+ * @see {@link GridFilters | The `<GridFilters />` component}
+ */
+type GridFilterProps = {
+    filters: IGridFilters;
+    onClearAllFilters: () => void;
+    onFiltersUpdated: (params: IGridFilters) => void;
+};
+export type IGridFilter<T> = {
+    enabled: boolean;
+    value: T | null;
+};
+export interface IGridFilters {
+    shipmentId: IGridFilter<string>;
+}
+/**
+ * @internal
+ *
+ * # GridFilters
+ *
+ * - The `<GridFilters />` component includes Filters used in ShipmentsGrid and LabelsGrid component.
+ *
+ * @see {@link GridFiltersProps | The props for the `<GridFilters />` component}
+ */
+export declare const GridFilters: ({ filters, onFiltersUpdated, onClearAllFilters }: GridFilterProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/src/components/grid-filters/grid-filters.styles.d.ts

@@ -0,0 +1,11 @@
+export declare const styles: {
+    getButtons: (theme: any) => {
+        display: "flex";
+        gap: any;
+        justifyContent: "flex-end";
+    };
+    getLabel: (theme: any) => {
+        display: "inline-block";
+        marginBottom: any;
+    };
+};

package/src/components/grid-filters/index.d.ts

@@ -0,0 +1,2 @@
+export { GridFilters } from './grid-filters';
+export type { IGridFilters } from './grid-filters';

package/src/components/grid-filters/shipment-id-filter-shema.d.ts

@@ -0,0 +1,9 @@
+import { z } from "zod";
+export declare const shipmentIdFormSchema: z.ZodObject<{
+    shipmentId: z.ZodString;
+}, "strip", z.ZodTypeAny, {
+    shipmentId: string;
+}, {
+    shipmentId: string;
+}>;
+export type ShipmentIdFormFields = z.input<typeof shipmentIdFormSchema>;

package/src/components/grid-filters/shipment-id-filter.d.ts

@@ -0,0 +1,23 @@
+import { IGridFilters } from "./grid-filters";
+/**
+ * @internal
+ *
+ * # Shipment Id Filter Props
+ *
+ * @see {@link ShipmentIdFilter | The `<ShipmentIdFilter />` component}
+ */
+type ShipmentIdFilterProps = {
+    filters: IGridFilters;
+    onFiltersUpdated: (params: IGridFilters) => void;
+};
+/**
+ * @internal
+ *
+ * # ShipmentIdFilter
+ *
+ * - The `<ShipmentIdFilter />` component handle shipment id filter used in Shipments Grid.
+ *
+ * @see {@link ShipmentIdFilterProps | The props for the `<ShipmentIdFilter />` component}
+ */
+export declare const ShipmentIdFilter: ({ filters, onFiltersUpdated }: ShipmentIdFilterProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/src/components/index.d.ts

@@ -19,6 +19,7 @@ export * from "./field";
 export * from "./form-portal";
 export * from "./fund-and-purchase";
 export * from "./grid-controller";
+export * from "./grid-filters";
 export * from "./history";
 export * from "./inline-label";
 export * from "./items-breakdown";

package/src/elements/label-layout/label-layout-element.d.ts

@@ -523,15 +523,33 @@ export declare const Element: ({ resources, ...props }: object & {
                 title: string;
                 headers: {
                     created: string;
-                    download: string;
-                    labelId: string;
-                    service: string;
-                    shipTo: string;
+                    shipmentId: string;
+                    parcels: string;
+                    recipient: string;
+                    shipping: string;
+                    shipDate: string;
+                    status: string;
+                };
+                empty: {
+                    title: string;
+                    subtitle: string;
+                };
+                emptyWithFilters: {
+                    title: string;
+                    subtitle: string;
+                    button: string;
+                };
+                status: {
+                    voided: string;
+                    error: string;
+                    completed: string;
+                    processing: string;
                 };
                 actions: {
-                    download: {
-                        pdf: string;
-                    };
+                    title: string;
+                    print: string;
+                    void: string;
+                    printForms: string;
                 };
             };
             "connect-carrier": {
@@ -751,6 +769,13 @@ export declare const Element: ({ resources, ...props }: object & {
                     "row-count_one": string;
                     "row-count_other": string;
                     rows: string;
+                    clearAll: string;
+                    shipmentId: string;
+                    shipmentIdFilter: string;
+                    apply: string;
+                    clear: string;
+                    search: string;
+                    shipmentIdHint: string;
                 };
                 insuranceProviders: {
                     carrier: string;
@@ -826,6 +851,7 @@ export declare const Element: ({ resources, ...props }: object & {
                     requiredList: string;
                     tooFewCharacters: string;
                     tooManyCharacters: string;
+                    requiredShipmentId: string;
                 };
                 shippingPresets: {
                     apply: string;

package/src/elements/labels-grid/hooks/use-labels-grid.d.ts

@@ -0,0 +1,67 @@
+/// <reference types="react" />
+import { LabelsGridProps } from "../";
+import { IGridFilters } from "../../../components";
+export declare const useLabelsGrid: ({ labelStatus, showShipmentIdFilter }: LabelsGridProps) => {
+    clearAllFilters: () => void;
+    filters: IGridFilters;
+    isAnyFilterActive: boolean;
+    isLoading: boolean;
+    labels: {
+        serviceName: string | null | undefined;
+        alternativeIdentifiers?: string[] | undefined;
+        batchId: string;
+        carrierCode: string;
+        carrierId: string;
+        chargeEvent: import("@shipengine/react-api").LabelChargeEvent;
+        createdAt: string;
+        displayScheme: import("@shipengine/react-api").LabelDisplayScheme;
+        formDownload: import("@shipengine/react-api").LinkedResource;
+        insuranceClaim: import("@shipengine/react-api").LinkedResource;
+        insuranceCost: import("@shipengine/react-api").Money;
+        isInternational: boolean;
+        isReturnLabel: boolean;
+        labelDownload: import("@shipengine/react-api").Download;
+        labelFormat: import("@shipengine/react-api").LabelFormat;
+        labelId: string;
+        labelImageId: string;
+        labelLayout: import("@shipengine/react-api").LabelLayout;
+        packageCode: string;
+        packages: import("@shipengine/react-api").ShipmentPackage[];
+        paperlessDownload: import("@shipengine/react-api").PaperlessDownload | null;
+        qrCodeDownload?: import("@shipengine/react-api").LinkedResource | undefined;
+        rateDetails: import("@shipengine/react-api").RateDetail[];
+        relayPoints: {
+            shipFrom: import("@shipengine/react-api").RelayPoint;
+            shipTo: import("@shipengine/react-api").RelayPoint;
+        };
+        requestedComparisonAmount?: import("@shipengine/react-api").Money | undefined;
+        rmaNumber: string;
+        serviceCode: string;
+        shipDate: string;
+        shipmentCost: import("@shipengine/react-api").Money;
+        shipmentId: string;
+        shippingRuleId: string | null;
+        shipTo: import("@shipengine/react-api").Address;
+        status: import("@shipengine/react-api").LabelStatus;
+        trackable: boolean;
+        trackingNumber: string;
+        trackingStatus: string;
+        trackingUrl: string;
+        voided: boolean;
+        voidedAt: string | null;
+    }[];
+    pageConfig: {
+        currentPage: number;
+        pagerProps: {
+            currentPage: number;
+            currentPageSize: number;
+            onPageSelect: (page: number) => void;
+            onPageSizeSelect: (pageSize: number) => void;
+        };
+        pagesAmount: number;
+        pageSize: number;
+        totalElements: number;
+    };
+    setFilters: import("react").Dispatch<import("react").SetStateAction<IGridFilters>>;
+    shouldShowFilters: boolean;
+};

package/src/elements/labels-grid/index.d.ts

@@ -1 +1,2 @@
 export * as LabelsGrid from "./labels-grid";
+export type { LabelsGridProps } from "./labels-grid";