@verifiedinc-public/shared-ui-elements 4.0.4-beta.2 → 4.0.4-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,18 +8,14 @@ interface UseBrandFilterInputProps {
8
8
  value: BrandFilter | BrandFilter[] | undefined;
9
9
  multiple?: boolean;
10
10
  onChange?: (brands: BrandFilter | BrandFilter[]) => void;
11
- getBrandsQuery: {
12
- data?: Brands[];
13
- isFetching: boolean;
14
- };
11
+ brands?: Brands[];
15
12
  maximumSelectedBrands?: number;
16
13
  }
17
- export declare function useBrandFilterInput({ value, multiple, onChange, getBrandsQuery, maximumSelectedBrands, }: UseBrandFilterInputProps): {
14
+ export declare function useBrandFilterInput({ value, multiple, onChange, brands, maximumSelectedBrands, }: UseBrandFilterInputProps): {
18
15
  brandOptions: {
19
16
  name: string;
20
17
  value: string;
21
18
  _raw: Brands;
22
19
  }[];
23
- isFetching: boolean;
24
20
  };
25
21
  export {};
@@ -1,16 +1,16 @@
1
- import { BrandFilter } from './types';
1
+ import { BrandFilter, BrandGroupConfig } from './types';
2
2
  export type Value = BrandFilter;
3
3
  interface BrandFilterInputProps {
4
4
  label: string;
5
5
  multiple?: boolean;
6
6
  value: Value | Value[] | undefined;
7
7
  onChange: (value: Value | Value[] | null) => void;
8
- getBrandsQuery: {
9
- data?: any[];
10
- isFetching: boolean;
11
- };
8
+ brands?: any[];
9
+ isLoading: boolean;
12
10
  maximumSelectedBrands?: number;
11
+ /** Configuration for how to group the brands. If null, no grouping will be applied */
12
+ groupConfig?: BrandGroupConfig;
13
13
  }
14
- export declare function BrandFilterInput({ label, multiple, value, onChange, getBrandsQuery, maximumSelectedBrands, }: Readonly<BrandFilterInputProps>): import("react").JSX.Element;
14
+ export declare function BrandFilterInput({ label, multiple, value, onChange, brands, isLoading, maximumSelectedBrands, groupConfig, }: Readonly<BrandFilterInputProps>): import("react").JSX.Element;
15
15
  export * from './types';
16
16
  export * from './BrandFilterInput.hook';
@@ -6,6 +6,7 @@ export interface Brands {
6
6
  oneClickCreated?: number;
7
7
  oneClickSuccess?: number;
8
8
  isLiveBrand?: boolean;
9
+ isApproved?: boolean;
9
10
  additionalData?: any;
10
11
  }
11
12
  export type BrandFilter = {
@@ -13,3 +14,56 @@ export type BrandFilter = {
13
14
  value: string;
14
15
  _raw: Brands;
15
16
  };
17
+ /**
18
+ * Type representing the display value for a group in the dropdown.
19
+ * This is what users will see as the group header.
20
+ */
21
+ export type GroupDisplayValue = string;
22
+ /**
23
+ * Configuration for grouping brands in the dropdown.
24
+ *
25
+ * @template K - The specific key from the Brands type that we want to group by.
26
+ * TypeScript will ensure type safety based on this key.
27
+ *
28
+ * @example
29
+ * // Group by live status
30
+ * const liveConfig: BrandGroupConfig<'isLiveBrand'> = {
31
+ * key: 'isLiveBrand',
32
+ * transform: (value) => value ? 'Live Brands' : 'Not Live',
33
+ * sortGroups: (a, b) => a === 'Live Brands' ? -1 : 1
34
+ * };
35
+ *
36
+ * // Group by integration type
37
+ * const integrationConfig: BrandGroupConfig<'integrationType'> = {
38
+ * key: 'integrationType',
39
+ * transform: (value) => `${value} Integration`
40
+ * };
41
+ *
42
+ * // No grouping
43
+ * const noGrouping: BrandGroupConfig = null;
44
+ */
45
+ export type BrandGroupConfig<K extends keyof Brands = keyof Brands> = {
46
+ /**
47
+ * The key from the Brands object to group by.
48
+ * TypeScript will ensure this is a valid key from the Brands type.
49
+ */
50
+ key: K;
51
+ /**
52
+ * Optional function to transform the raw brand value into a display string.
53
+ * The input type is automatically inferred from the key.
54
+ * For example, if key is 'isLiveBrand', value will be boolean | undefined.
55
+ *
56
+ * If not provided, the raw value will be converted to a string.
57
+ */
58
+ transform?: (value: Brands[K]) => GroupDisplayValue;
59
+ /**
60
+ * Optional function to customize the order of groups in the dropdown.
61
+ * Takes two group display values and returns:
62
+ * - Negative number if a should come before b
63
+ * - Positive number if b should come before a
64
+ * - Zero if the order doesn't matter
65
+ *
66
+ * If not provided, groups will be ordered alphabetically.
67
+ */
68
+ sortGroups?: (a: GroupDisplayValue, b: GroupDisplayValue) => number;
69
+ } | null;
@@ -1 +1 @@
1
- "use strict";import{A as a,c as s,l as e,B as t,n,m as r,C as o,D as i,f as p,E as u,j as m,F as c,I as d,b as l,L as I,O as P,h as B,e as g,P as S,Q as h,R as k,S as f,d as C,k as T,T as b,g as y,a as A,V as F,i as L,t as R,u as D}from"../shared/index-DFAvYi1Z.mjs";import{a as E,b as O,P as x,S as H}from"../shared/PageSectionHeader-DdpDhBZG.mjs";import{C as N,W as V,u as W}from"../shared/index-Cbzc-ZBt.mjs";import{SnackbarProvider as v}from"notistack";export{a as AcceptTermsNotice,s as Alert,e as Backdrop,t as Banner,n as BrandFilterInput,r as Button,o as CredentialRequestsEditor,N as CustomAlertComponent,i as DateInput,p as DateRangeInput,u as EmailInput,m as ExactBirthdayBanner,c as FullWidthAlert,d as Image,l as LegalLink,I as LinkButton,P as OTPInput,B as OneClickForm,E as PageHeader,O as PageSectionHeader,x as Paragraph,g as PhoneInput,S as PrivacyPolicyNotice,h as QRCodeDisplay,k as ResendPhoneBanner,f as SSNInput,H as SectionHeader,C as SelectInput,v as SnackbarProvider,T as TestPhoneNumbersBanner,b as TextButton,y as TimezoneInput,A as Typography,F as VerifiedImage,L as VerifiedIncLogo,V as When,R as toOption,D as useBrandFilterInput,W as useSnackbar};
1
+ "use strict";import{A as a,c as s,l as e,B as t,n,m as r,C as o,D as i,f as p,E as u,j as m,F as c,I as d,b as l,L as I,O as P,h as B,e as g,P as S,Q as h,R as k,S as f,d as C,k as T,T as b,g as y,a as A,V as F,i as L,t as R,u as D}from"../shared/index-Dvbzb5OO.mjs";import{a as E,b as O,P as x,S as H}from"../shared/PageSectionHeader-DdpDhBZG.mjs";import{C as N,W as V,u as W}from"../shared/index-Cbzc-ZBt.mjs";import{SnackbarProvider as v}from"notistack";export{a as AcceptTermsNotice,s as Alert,e as Backdrop,t as Banner,n as BrandFilterInput,r as Button,o as CredentialRequestsEditor,N as CustomAlertComponent,i as DateInput,p as DateRangeInput,u as EmailInput,m as ExactBirthdayBanner,c as FullWidthAlert,d as Image,l as LegalLink,I as LinkButton,P as OTPInput,B as OneClickForm,E as PageHeader,O as PageSectionHeader,x as Paragraph,g as PhoneInput,S as PrivacyPolicyNotice,h as QRCodeDisplay,k as ResendPhoneBanner,f as SSNInput,H as SectionHeader,C as SelectInput,v as SnackbarProvider,T as TestPhoneNumbersBanner,b as TextButton,y as TimezoneInput,A as Typography,F as VerifiedImage,L as VerifiedIncLogo,V as When,R as toOption,D as useBrandFilterInput,W as useSnackbar};
package/dist/index.mjs CHANGED
@@ -1 +1 @@
1
- "use strict";import{A as e,c as t,l as r,B as o,n,m as i,C as m,D as u,f as l,E as c,j as d,F as p,I as h,b as f,L as S,O as g,h as C,e as k,P,Q as y,R as b,S as D,d as B,k as I,T,g as w,a as N,V as R,i as v,o as Y,q as F,r as O,w as x,p as A,s as G,t as L,u as M,v as W}from"./shared/index-DFAvYi1Z.mjs";import{a as z,b as E,P as V,S as H}from"./shared/PageSectionHeader-DdpDhBZG.mjs";import{C as j,W as q,u as U}from"./shared/index-Cbzc-ZBt.mjs";import{b as Q,d as $,a as K,j as X,u as Z,e as J,c as _,f as aa,g as sa,h as ea,i as ta}from"./shared/useIntersectionObserver-CbpWuEs0.mjs";import{u as ra}from"./shared/useCopyToClipboard-BALOSYVW.mjs";import{a as oa,u as na}from"./shared/useOnClickOutside-P5GTcgh8.mjs";import{u as ia}from"./shared/useCounter-BV32zXDQ.mjs";import{u as ma}from"./shared/usePrevious-DyvR1iCQ.mjs";import{b as ua,a as la,v as ca,e as da,d as pa,p as ha,u as fa,h as Sa,j as ga,g as Ca,o as ka,s as Pa,m as ya,c as ba,l as Da,n as Ba,q as Ia,f as Ta,i as wa,r as Na,z as Ra,t as va,x as Ya,k as Fa,w as Oa,y as xa}from"./shared/shadows-Dhd7FrwF.mjs";import{f as Aa,b as Ga,a as La,c as Ma,u as Wa}from"./shared/uuidColor-Dw38-aYm.mjs";import{masks as za}from"./utils/masks/index.mjs";import{toCapitalize as Ea,toSentenceCase as Va}from"./utils/string/index.mjs";import{k as Ha}from"./shared/formatKebabToPretty-Du43TgPC.mjs";import{M as ja,S as qa,U as Ua,d as Qa,e as $a,f as Ka,g as Xa,a as Za,s as Ja}from"./shared/unix.schema-CMYTtXco.mjs";import{p as _a}from"./shared/phone.schema-XBbyizhq.mjs";import{SnackbarProvider as as}from"notistack";async function ss(a){try{return[await a,null]}catch(s){return[null,s]}}const es=a=>a.replace(/(\d{3})-?(\d{2})-?(\d{4})/,"\u2022\u2022\u2022-\u2022\u2022-$3");export{e as AcceptTermsNotice,t as Alert,r as Backdrop,o as Banner,n as BrandFilterInput,i as Button,m as CredentialRequestsEditor,j as CustomAlertComponent,u as DateInput,l as DateRangeInput,c as EmailInput,d as ExactBirthdayBanner,p as FullWidthAlert,h as Image,f as LegalLink,S as LinkButton,ja as MaskedAndUnmaskedSSNSchema,g as OTPInput,C as OneClickForm,z as PageHeader,E as PageSectionHeader,V as Paragraph,k as PhoneInput,P as PrivacyPolicyNotice,y as QRCodeDisplay,b as ResendPhoneBanner,D as SSNInput,qa as SSNSchema,H as SectionHeader,B as SelectInput,as as SnackbarProvider,I as TestPhoneNumbersBanner,T as TextButton,w as TimezoneInput,N as Typography,Ua as USDateSchema,R as VerifiedImage,v as VerifiedIncLogo,q as When,ua as black,la as blue,ca as colors,Y as countries,da as darkBlue,pa as darkGreen,ha as darkGrey,fa as darkGreyContrast,Sa as darkRed,ga as darkYellow,Qa as descriptionSchema,$a as emailSchema,Ka as fieldSchema,Aa as formatDateMMDDYYYY,Ga as formatDateMMYY,La as formatDateToTimestamp,Ma as formatExtendedDate,Xa as getDateSchemaWithPastValidation,F as getPhoneData,O as getPhoneDataByFieldName,Za as getUnixSchema,Ca as green,ka as grey,Pa as greyContrast,ya as infoContrast,Ha as kebabCaseToPretty,ba as lightBlue,Da as lightGreen,Ba as lightGrey,Ia as lightGreyContrast,Ta as lightRed,wa as lightYellow,za as masks,x as omitProperties,A as parseToPhoneNational,_a as phoneSchema,Na as red,Ra as shadows,G as sortByCountryName,es as ssnFormatter,Ja as stateSchema,va as textDisabled,Ya as theme,Ea as toCapitalize,L as toOption,Va as toSentenceCase,M as useBrandFilterInput,Q as useCallbackRef,ra as useCopyToClipboard,ia as useCounter,$ as useDebounceValue,K as useDisclosure,X as useIntersectionObserver,Z as useLocalStorage,oa as useOnClickOutside,ma as usePrevious,na as useQRCode,J as useScript,_ as useSearchParams,U as useSnackbar,aa as useThrottle,sa as useToggle,ea as useWindowScroll,ta as useWindowSize,Wa as uuidToHashedColor,W as validatePhone,Fa as warningContrast,Oa as white,ss as wrapPromise,xa as yellow};
1
+ "use strict";import{A as e,c as t,l as r,B as o,n,m as i,C as m,D as u,f as l,E as c,j as d,F as p,I as h,b as f,L as S,O as g,h as C,e as k,P,Q as y,R as b,S as D,d as B,k as I,T,g as w,a as N,V as R,i as v,o as Y,q as F,r as O,w as x,p as A,s as G,t as L,u as M,v as W}from"./shared/index-Dvbzb5OO.mjs";import{a as z,b as E,P as V,S as H}from"./shared/PageSectionHeader-DdpDhBZG.mjs";import{C as j,W as q,u as U}from"./shared/index-Cbzc-ZBt.mjs";import{b as Q,d as $,a as K,j as X,u as Z,e as J,c as _,f as aa,g as sa,h as ea,i as ta}from"./shared/useIntersectionObserver-CbpWuEs0.mjs";import{u as ra}from"./shared/useCopyToClipboard-BALOSYVW.mjs";import{a as oa,u as na}from"./shared/useOnClickOutside-P5GTcgh8.mjs";import{u as ia}from"./shared/useCounter-BV32zXDQ.mjs";import{u as ma}from"./shared/usePrevious-DyvR1iCQ.mjs";import{b as ua,a as la,v as ca,e as da,d as pa,p as ha,u as fa,h as Sa,j as ga,g as Ca,o as ka,s as Pa,m as ya,c as ba,l as Da,n as Ba,q as Ia,f as Ta,i as wa,r as Na,z as Ra,t as va,x as Ya,k as Fa,w as Oa,y as xa}from"./shared/shadows-Dhd7FrwF.mjs";import{f as Aa,b as Ga,a as La,c as Ma,u as Wa}from"./shared/uuidColor-Dw38-aYm.mjs";import{masks as za}from"./utils/masks/index.mjs";import{toCapitalize as Ea,toSentenceCase as Va}from"./utils/string/index.mjs";import{k as Ha}from"./shared/formatKebabToPretty-Du43TgPC.mjs";import{M as ja,S as qa,U as Ua,d as Qa,e as $a,f as Ka,g as Xa,a as Za,s as Ja}from"./shared/unix.schema-CMYTtXco.mjs";import{p as _a}from"./shared/phone.schema-XBbyizhq.mjs";import{SnackbarProvider as as}from"notistack";async function ss(a){try{return[await a,null]}catch(s){return[null,s]}}const es=a=>a.replace(/(\d{3})-?(\d{2})-?(\d{4})/,"\u2022\u2022\u2022-\u2022\u2022-$3");export{e as AcceptTermsNotice,t as Alert,r as Backdrop,o as Banner,n as BrandFilterInput,i as Button,m as CredentialRequestsEditor,j as CustomAlertComponent,u as DateInput,l as DateRangeInput,c as EmailInput,d as ExactBirthdayBanner,p as FullWidthAlert,h as Image,f as LegalLink,S as LinkButton,ja as MaskedAndUnmaskedSSNSchema,g as OTPInput,C as OneClickForm,z as PageHeader,E as PageSectionHeader,V as Paragraph,k as PhoneInput,P as PrivacyPolicyNotice,y as QRCodeDisplay,b as ResendPhoneBanner,D as SSNInput,qa as SSNSchema,H as SectionHeader,B as SelectInput,as as SnackbarProvider,I as TestPhoneNumbersBanner,T as TextButton,w as TimezoneInput,N as Typography,Ua as USDateSchema,R as VerifiedImage,v as VerifiedIncLogo,q as When,ua as black,la as blue,ca as colors,Y as countries,da as darkBlue,pa as darkGreen,ha as darkGrey,fa as darkGreyContrast,Sa as darkRed,ga as darkYellow,Qa as descriptionSchema,$a as emailSchema,Ka as fieldSchema,Aa as formatDateMMDDYYYY,Ga as formatDateMMYY,La as formatDateToTimestamp,Ma as formatExtendedDate,Xa as getDateSchemaWithPastValidation,F as getPhoneData,O as getPhoneDataByFieldName,Za as getUnixSchema,Ca as green,ka as grey,Pa as greyContrast,ya as infoContrast,Ha as kebabCaseToPretty,ba as lightBlue,Da as lightGreen,Ba as lightGrey,Ia as lightGreyContrast,Ta as lightRed,wa as lightYellow,za as masks,x as omitProperties,A as parseToPhoneNational,_a as phoneSchema,Na as red,Ra as shadows,G as sortByCountryName,es as ssnFormatter,Ja as stateSchema,va as textDisabled,Ya as theme,Ea as toCapitalize,L as toOption,Va as toSentenceCase,M as useBrandFilterInput,Q as useCallbackRef,ra as useCopyToClipboard,ia as useCounter,$ as useDebounceValue,K as useDisclosure,X as useIntersectionObserver,Z as useLocalStorage,oa as useOnClickOutside,ma as usePrevious,na as useQRCode,J as useScript,_ as useSearchParams,U as useSnackbar,aa as useThrottle,sa as useToggle,ea as useWindowScroll,ta as useWindowSize,Wa as uuidToHashedColor,W as validatePhone,Fa as warningContrast,Oa as white,ss as wrapPromise,xa as yellow};