@avenue-ticketing/ui 0.12.0-beta.1 → 0.12.0-beta.2
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.
- package/dist/react/checkbox.js +10 -7
- package/dist/react/checkbox.js.map +1 -1
- package/dist/react/combobox.d.ts +3 -2
- package/dist/react/combobox.js +284 -32
- package/dist/react/combobox.js.map +1 -1
- package/dist/react/dropdown-account-breadcrumb.js +176 -14
- package/dist/react/dropdown-account-breadcrumb.js.map +1 -1
- package/dist/react/dropdown-account-button.js +186 -21
- package/dist/react/dropdown-account-button.js.map +1 -1
- package/dist/react/dropdown-account-card-md.js +187 -22
- package/dist/react/dropdown-account-card-md.js.map +1 -1
- package/dist/react/dropdown-account-card-sm.js +187 -22
- package/dist/react/dropdown-account-card-sm.js.map +1 -1
- package/dist/react/dropdown-account-card-xs.js +187 -22
- package/dist/react/dropdown-account-card-xs.js.map +1 -1
- package/dist/react/dropdown-avatar.js +186 -21
- package/dist/react/dropdown-avatar.js.map +1 -1
- package/dist/react/dropdown-button-advanced.js +186 -21
- package/dist/react/dropdown-button-advanced.js.map +1 -1
- package/dist/react/dropdown-button-link.js +187 -22
- package/dist/react/dropdown-button-link.js.map +1 -1
- package/dist/react/dropdown-button-simple.js +186 -21
- package/dist/react/dropdown-button-simple.js.map +1 -1
- package/dist/react/dropdown-icon-advanced.js +187 -22
- package/dist/react/dropdown-icon-advanced.js.map +1 -1
- package/dist/react/dropdown-icon-simple.js +187 -22
- package/dist/react/dropdown-icon-simple.js.map +1 -1
- package/dist/react/dropdown-integration.js +186 -21
- package/dist/react/dropdown-integration.js.map +1 -1
- package/dist/react/dropdown-search-advanced.js +186 -21
- package/dist/react/dropdown-search-advanced.js.map +1 -1
- package/dist/react/dropdown-search-simple.js +186 -21
- package/dist/react/dropdown-search-simple.js.map +1 -1
- package/dist/react/dropdown.d.ts +4 -1
- package/dist/react/dropdown.js +187 -22
- package/dist/react/dropdown.js.map +1 -1
- package/dist/react/input-tags-outer.js +8 -8
- package/dist/react/input-tags-outer.js.map +1 -1
- package/dist/react/input-tags.js +8 -8
- package/dist/react/input-tags.js.map +1 -1
- package/dist/react/multi-select.d.ts +3 -2
- package/dist/react/multi-select.js +228 -27
- package/dist/react/multi-select.js.map +1 -1
- package/dist/react/popover.d.ts +10 -1
- package/dist/react/popover.js +195 -18
- package/dist/react/popover.js.map +1 -1
- package/dist/react/radio-buttons.js +2 -1
- package/dist/react/radio-buttons.js.map +1 -1
- package/dist/react/select-item.d.ts +2 -1
- package/dist/react/select-item.js +11 -7
- package/dist/react/select-item.js.map +1 -1
- package/dist/react/select.d.ts +4 -3
- package/dist/react/select.js +298 -42
- package/dist/react/select.js.map +1 -1
- package/dist/react/switch.js +1 -1
- package/dist/react/switch.js.map +1 -1
- package/dist/react/tag-select.d.ts +5 -2
- package/dist/react/tag-select.js +215 -25
- package/dist/react/tag-select.js.map +1 -1
- package/dist/react/tags.js +8 -8
- package/dist/react/tags.js.map +1 -1
- package/dist/select-mobile-sheet-CB2ptDTJ.d.ts +12 -0
- package/dist/{select-shared-B3Y5SMXU.d.ts → select-shared-oJEeJxeB.d.ts} +6 -0
- package/package.json +1 -1
- package/theme.css +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../utils/cx.ts","../../../../components/base/avatar/base-components/avatar-online-indicator.tsx","../../../../components/base/avatar/base-components/verified-tick.tsx","../../../../components/base/avatar/base-components/avatar-count.tsx","../../../../components/base/avatar/avatar.tsx","../../../../components/base/checkbox/checkbox.tsx","../../../../utils/is-react-component.ts","../../../../components/base/select/select-shared.tsx","../../../../components/base/select/select-item.tsx"],"names":["jsx","jsxs","sizes","User01","AriaListBoxItem","AriaText","Check"],"mappings":";;;;;;;;AAEA,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAChC,MAAA,EAAQ;AAAA,IACJ,KAAA,EAAO;AAAA,MACH,MAAM,CAAC,YAAA,EAAc,cAAc,YAAA,EAAc,YAAA,EAAc,cAAc,aAAa;AAAA;AAC9F;AAER,CAAC,CAAA;AAMM,IAAM,EAAA,GAAK,OAAA;ACVlB,IAAM,KAAA,GAAQ;AAAA,EACV,EAAA,EAAI,UAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,EAAA,EAAI,UAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,EAAA,EAAI,UAAA;AAAA,EACJ,KAAA,EAAO,QAAA;AAAA,EACP,KAAA,EAAO,UAAA;AAAA,EACP,KAAA,EAAO;AACX,CAAA;AAQO,IAAM,wBAAwB,CAAC,EAAE,MAAM,MAAA,EAAQ,SAAA,uBAClDA,GAAAA;AAAA,EAAC,MAAA;AAAA,EAAA;AAAA,IACG,SAAA,EAAW,EAAA;AAAA,MACP,yFAAA;AAAA,MACA,MAAA,KAAW,WAAW,yBAAA,GAA4B,wBAAA;AAAA,MAClD,MAAM,IAAI,CAAA;AAAA,MACV;AAAA,KACJ;AAAA,IACA,KAAA,EAAO;AAAA,MACH,eAAA,EACI;AAAA,KACR;AAAA,IAGA,QAAA,kBAAAC,KAAC,KAAA,EAAA,EAAI,OAAA,EAAQ,gBAAe,IAAA,EAAK,MAAA,EAAO,WAAU,0BAAA,EAC9C,QAAA,EAAA;AAAA,sBAAAD,GAAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACG,CAAA,EAAE,qJAAA;AAAA,UACF,IAAA,EAAK,2BAAA;AAAA,UACL,WAAA,EAAY;AAAA;AAAA,OAChB;AAAA,sBACAA,GAAAA,CAAC,MAAA,EAAA,EACG,QAAA,kBAAAC,IAAAA,CAAC,oBAAe,EAAA,EAAG,qBAAA,EAAsB,EAAA,EAAG,KAAA,EAAM,IAAG,GAAA,EAAI,EAAA,EAAG,OAAM,EAAA,EAAG,KAAA,EAAM,eAAc,gBAAA,EACrF,QAAA,EAAA;AAAA,wBAAAD,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,OAAA,EAAQ,CAAA;AAAA,wBACxBA,IAAC,MAAA,EAAA,EAAK,MAAA,EAAO,KAAI,SAAA,EAAU,OAAA,EAAQ,aAAY,KAAA,EAAM;AAAA,OAAA,EACzD,CAAA,EACJ;AAAA,KAAA,EACJ;AAAA;AACJ,CAAA;AC5CJ,IAAME,MAAAA,GAAQ;AAAA,EACV,EAAA,EAAI,UAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,EAAA,EAAI,UAAA;AAAA,EACJ,EAAA,EAAI,QAAA;AAAA,EACJ,EAAA,EAAI,UAAA;AAAA,EACJ,KAAA,EAAO,QAAA;AAAA,EACP,KAAA,EAAO,QAAA;AAAA,EACP,KAAA,EAAO;AACX,CAAA;AAOO,IAAM,YAAA,GAAe,CAAC,EAAE,IAAA,EAAM,WAAU,qBAC3CD,KAAC,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,4BAAA,EAA8BC,MAAAA,CAAM,IAAI,CAAA,EAAG,SAAS,GAAG,OAAA,EAAQ,WAAA,EAAY,MAAK,MAAA,EAC/F,QAAA,EAAA;AAAA,kBAAAF,GAAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACG,CAAA,EAAE,inDAAA;AAAA,MACF,SAAA,EAAU;AAAA;AAAA,GACd;AAAA,kBACAA,GAAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACG,QAAA,EAAS,SAAA;AAAA,MACT,QAAA,EAAS,SAAA;AAAA,MACT,CAAA,EAAE,+oBAAA;AAAA,MACF,IAAA,EAAK;AAAA;AAAA;AACT,CAAA,EACJ,CAAA;ACvBG,IAAM,WAAA,GAAc,CAAC,EAAE,KAAA,EAAO,WAAU,qBAC3CA,IAAC,KAAA,EAAA,EAAI,SAAA,EAAW,GAAG,gCAAA,EAAkC,SAAS,GAC1D,QAAA,kBAAAA,GAAAA,CAAC,SAAI,SAAA,EAAU,wIAAA,EACV,iBACL,CAAA,EACJ,CAAA;AC0DJ,IAAM,MAAA,GAAS;AAAA,EACX,EAAA,EAAI,EAAE,IAAA,EAAM,QAAA,EAAU,gBAAgB,MAAA,EAAQ,QAAA,EAAU,uBAAA,EAAyB,IAAA,EAAM,QAAA,EAAS;AAAA,EAChG,EAAA,EAAI,EAAE,IAAA,EAAM,QAAA,EAAU,gBAAgB,MAAA,EAAQ,QAAA,EAAU,uBAAA,EAAyB,IAAA,EAAM,QAAA,EAAS;AAAA,EAChG,EAAA,EAAI,EAAE,IAAA,EAAM,SAAA,EAAW,gBAAgB,MAAA,EAAQ,QAAA,EAAU,uBAAA,EAAyB,IAAA,EAAM,QAAA,EAAS;AAAA,EACjG,EAAA,EAAI,EAAE,IAAA,EAAM,SAAA,EAAW,gBAAgB,WAAA,EAAa,QAAA,EAAU,uBAAA,EAAyB,IAAA,EAAM,QAAA,EAAS;AAAA,EACtG,EAAA,EAAI,EAAE,IAAA,EAAM,SAAA,EAAW,gBAAgB,OAAA,EAAS,QAAA,EAAU,uBAAA,EAAyB,IAAA,EAAM,QAAA,EAAS;AAAA,EAClG,KAAA,EAAO,EAAE,IAAA,EAAM,SAAA,EAAW,gBAAgB,OAAA,EAAS,QAAA,EAAU,+BAAA,EAAiC,IAAA,EAAM,QAAA;AACxG,CAAA;AAEO,IAAM,SAAS,CAAC;AAAA,EACnB,IAAA,GAAO,IAAA;AAAA,EACP,GAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA,EAAiB,eAAA;AAAA,EACjB,MAAA;AAAA,EACA,KAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,OAAA,GAAU,IAAA;AAAA,EACV,SAAA;AAAA,EACA;AACJ,CAAA,KAAmB;AACf,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,SAAS,KAAK,CAAA;AAE9C,EAAA,MAAM,YAAA,GAAe,OAAO,CAAC,QAAA;AAE7B,EAAA,MAAM,oBAAoB,MAAM;AAC5B,IAAA,IAAI,YAAA,EAAc;AACd,MAAA,uBAAOA,GAAAA,CAAC,KAAA,EAAA,EAAI,iBAAA,EAAe,IAAA,EAAC,SAAA,EAAU,wBAAA,EAAyB,GAAA,EAAU,GAAA,EAAU,OAAA,EAAS,MAAM,WAAA,CAAY,IAAI,CAAA,EAAG,CAAA;AAAA,IACzH;AAEA,IAAA,IAAI,QAAA,EAAU;AACV,MAAA,uBAAOA,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,MAAA,CAAO,IAAI,CAAA,CAAE,QAAQ,CAAA,EAAI,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,IACpF;AAEA,IAAA,IAAI,eAAA,EAAiB;AACjB,MAAA,uBAAOA,GAAAA,CAAC,eAAA,EAAA,EAAgB,SAAA,EAAW,EAAA,CAAG,sBAAsB,MAAA,CAAO,IAAI,CAAA,CAAE,IAAI,CAAA,EAAG,CAAA;AAAA,IACpF;AAEA,IAAA,OAAO,WAAA,oBAAeA,GAAAA,CAACG,QAAA,EAAA,EAAO,SAAA,EAAW,EAAA,CAAG,oBAAA,EAAsB,MAAA,CAAO,IAAI,CAAA,CAAE,IAAI,CAAA,EAAG,CAAA;AAAA,EAC1F,CAAA;AAEA,EAAA,MAAM,qBAAqB,MAAM;AAC7B,IAAA,IAAI,MAAA,EAAQ;AACR,MAAA,uBAAOH,GAAAA,CAAC,qBAAA,EAAA,EAAsB,MAAA,EAAgB,IAAA,EAAY,CAAA;AAAA,IAC9D;AAEA,IAAA,IAAI,QAAA,EAAU;AACV,MAAA,uBAAOA,GAAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAY,SAAA,EAAW,GAAG,2BAAA,EAA6B,IAAA,KAAS,IAAA,IAAQ,sBAAsB,CAAA,EAAG,CAAA;AAAA,IAC1H;AAEA,IAAA,IAAI,KAAA,EAAO;AACP,MAAA,uBAAOA,GAAAA,CAAC,WAAA,EAAA,EAAY,KAAA,EAAc,CAAA;AAAA,IACtC;AAEA,IAAA,OAAO,KAAA;AAAA,EACX,CAAA;AAEA,EAAA,uBACIC,IAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACG,aAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,EAAA;AAAA,QACP,6CAAA;AAAA,QACA,OAAA,IAAW,cAAA;AAAA;AAAA,QAEX,SAAA,IACI,+HAAA;AAAA,QACJ,MAAA,IAAU,2BAAA;AAAA,QACV,MAAA,IAAU,MAAA,CAAO,IAAI,CAAA,CAAE,cAAA;AAAA,QACvB,MAAA,CAAO,IAAI,CAAA,CAAE,IAAA;AAAA,QACb;AAAA,OACJ;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAD,GAAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACG,SAAA,EAAW,EAAA;AAAA,cACP,0LAAA;AAAA,cACA,OAAA,IAAW,cAAA;AAAA,cACX,YAAA,IACI,SAAS,IAAA,IACT,2LAAA;AAAA,cACJ;AAAA,aACJ;AAAA,YAEC,QAAA,EAAA,iBAAA;AAAkB;AAAA,SACvB;AAAA,QACC,kBAAA;AAAmB;AAAA;AAAA,GACxB;AAER,CAAA;AC9JA,IAAM,sBAAA,GAAyB,EAAA;AAC/B,IAAM,qBAAA,GAAwB,GAAA;AAG9B,SAAS,yBAAA,CAA0B,EAAE,SAAA,EAAU,EAA2B;AACtE,EAAA,MAAM,OAAA,GAAU,OAAuB,IAAI,CAAA;AAE3C,EAAA,eAAA,CAAgB,MAAM;AAClB,IAAA,MAAM,OAAO,OAAA,CAAQ,OAAA;AACrB,IAAA,IAAI,CAAC,IAAA,IAAQ,OAAO,IAAA,CAAK,mBAAmB,UAAA,EAAY;AACxD,IAAA,MAAM,GAAA,GAAM,KAAK,cAAA,EAAe;AAChC,IAAA,IAAI,OAAO,CAAA,EAAG;AAEd,IAAA,IAAA,CAAK,KAAA,CAAM,eAAA,GAAkB,CAAA,EAAG,GAAG,CAAA,CAAA;AACnC,IAAA,IAAA,CAAK,KAAA,CAAM,gBAAA,GAAmB,CAAA,EAAG,GAAG,CAAA,CAAA;AAEpC,IAAA,IAAI,OAAO,IAAA,CAAK,OAAA,KAAY,UAAA,EAAY;AACpC,MAAA,IAAA,CAAK,MAAM,gBAAA,GAAmB,GAAA;AAC9B,MAAA;AAAA,IACJ;AAEA,IAAA,MAAM,IAAA,GAAO,IAAA,CAAK,OAAA,CAAQ,CAAC,EAAE,gBAAA,EAAkB,GAAA,EAAI,EAAG,EAAE,gBAAA,EAAkB,CAAA,EAAG,CAAA,EAAG;AAAA,MAC5E,QAAA,EAAU,qBAAA;AAAA,MACV,KAAA,EAAO,sBAAA;AAAA,MACP,MAAA,EAAQ,+BAAA;AAAA,MACR,IAAA,EAAM;AAAA,KACT,CAAA;AACD,IAAA,OAAO,MAAM,KAAK,MAAA,EAAO;AAAA,EAC7B,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,uBACIA,GAAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAY,QAAO,OAAA,EAAQ,WAAA,EAAY,IAAA,EAAK,MAAA,EAAO,SAAA,EAAW,EAAA,CAAG,gBAAA,EAAkB,SAAS,GAC7F,QAAA,kBAAAA,GAAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACG,GAAA,EAAK,OAAA;AAAA,MACL,CAAA,EAAE,wCAAA;AAAA,MACF,MAAA,EAAO,cAAA;AAAA,MACP,WAAA,EAAY,GAAA;AAAA,MACZ,aAAA,EAAc,OAAA;AAAA,MACd,cAAA,EAAe;AAAA;AAAA,GACnB,EACJ,CAAA;AAER;AAGA,IAAM,eAAA,GACF,2GAAA;AAWG,IAAM,YAAA,GAAe,CAAC,EAAE,SAAA,EAAW,UAAA,EAAY,UAAA,EAAY,eAAA,EAAiB,IAAA,GAAO,IAAA,EAAM,cAAA,GAAiB,KAAA,EAAM,KAAyB;AAC5I,EAAA,MAAM,YAAY,UAAA,IAAc,eAAA;AAChC,EAAA,MAAM,aAAA,GAAgB,IAAA,KAAS,IAAA,GAAO,UAAA,GAAa,UAAA;AAEnD,EAAA,uBACIC,IAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACG,SAAA,EAAW,EAAA;AAAA,QACP,sHAAA;AAAA,QACA,IAAA,KAAS,OAAO,mBAAA,GAAsB,mBAAA;AAAA,QACtC,YAAY,mCAAA,GAAsC,YAAA;AAAA,QAClD,UAAA,IAAc,+BAAA;AAAA,QACd,UAAA,IAAc,CAAC,SAAA,IAAa,aAAA;AAAA,QAC5B,cAAA,IAAkB,CAAC,UAAA,IAAc,eAAA;AAAA,QACjC;AAAA,OACJ;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,eAAA,oBACGD,GAAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACG,aAAA,EAAY,MAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YACR,IAAA,EAAK,MAAA;AAAA,YACL,SAAA,EAAW,EAAA,CAAG,kDAAA,EAAoD,aAAa,CAAA;AAAA,YAE/E,QAAA,kBAAAA,GAAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,oBAAA,EAAqB,MAAA,EAAO,cAAA,EAAe,WAAA,EAAY,GAAA,EAAI,aAAA,EAAc,OAAA,EAAQ,cAAA,EAAe,OAAA,EAAQ;AAAA;AAAA,SACpH;AAAA,QAGH,UAAA,IAAc,CAAC,eAAA,oBACZA,GAAAA,CAAC,6BAA0B,SAAA,EAAW,EAAA,CAAG,mCAAA,EAAqC,aAAa,CAAA,EAAG;AAAA;AAAA;AAAA,GAEtG;AAER,CAAA;AACA,YAAA,CAAa,WAAA,GAAc,cAAA;;;ACvFpB,IAAM,mBAAA,GAAsB,CAAC,SAAA,KAA+C;AAC/E,EAAA,OAAO,OAAO,SAAA,KAAc,UAAA;AAChC,CAAA;AAKO,IAAM,gBAAA,GAAmB,CAAC,SAAA,KAAgE;AAC7F,EAAA,OAAO,OAAO,SAAA,KAAc,UAAA,IAAc,SAAA,CAAU,SAAA,KAAc,CAAC,CAAC,SAAA,CAAU,SAAA,CAAU,gBAAA,IAAoB,CAAC,CAAC,UAAU,SAAA,CAAU,MAAA,CAAA;AACtI,CAAA;AAKO,IAAM,qBAAA,GAAwB,CAAC,SAAA,KAAsE;AACxG,EAAA,OAAO,OAAO,cAAc,QAAA,IAAY,SAAA,KAAc,QAAQ,SAAA,CAAU,QAAA,CAAS,UAAS,KAAM,2BAAA;AACpG,CAAA;AAKO,IAAM,gBAAA,GAAmB,CAAC,SAAA,KAAgD;AAC7E,EAAA,OAAO,oBAAoB,SAAS,CAAA,IAAK,sBAAsB,SAAS,CAAA,IAAK,iBAAiB,SAAS,CAAA;AAC3G,CAAA;ACkBO,IAAM,aAAA,GAAgB,aAAA,CAA4C,EAAE,IAAA,EAAM,MAAM,CAAA;ACnCvF,IAAME,MAAAA,GAAQ;AAAA,EACV,EAAA,EAAI;AAAA,IACA,IAAA,EAAM,iEAAA;AAAA,IACN,IAAA,EAAM,SAAA;AAAA,IACN,aAAA,EAAe,WAAA;AAAA,IACf,KAAA,EAAO,wBAAA;AAAA,IACP,QAAA,EAAU;AAAA,GACd;AAAA,EACA,EAAA,EAAI;AAAA,IACA,IAAA,EAAM,qCAAA;AAAA,IACN,IAAA,EAAM,SAAA;AAAA,IACN,aAAA,EAAe,SAAA;AAAA,IACf,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU;AAAA,GACd;AAAA,EACA,EAAA,EAAI;AAAA,IACA,IAAA,EAAM,qCAAA;AAAA,IACN,IAAA,EAAM,SAAA;AAAA,IACN,aAAA,EAAe,SAAA;AAAA,IACf,KAAA,EAAO,QAAA;AAAA,IACP,QAAA,EAAU;AAAA;AAElB,CAAA;AASO,IAAM,aAAa,CAAC;AAAA,EACvB,KAAA;AAAA,EACA,EAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,UAAA;AAAA,EACA,IAAA,EAAM,IAAA;AAAA,EACN,SAAA;AAAA,EACA,QAAA;AAAA,EACA,kBAAA,GAAqB,WAAA;AAAA,EACrB,uBAAA,GAA0B,OAAA;AAAA,EAC1B,GAAG;AACP,CAAA,KAAuB;AACnB,EAAA,MAAM,EAAE,IAAA,EAAK,GAAI,UAAA,CAAW,aAAa,CAAA;AAEzC,EAAA,MAAM,eAAA,GAAkB,KAAA,KAAU,OAAO,QAAA,KAAa,WAAW,QAAA,GAAW,EAAA,CAAA;AAC5E,EAAA,MAAM,SAAA,GAAY,cAAA,GAAiB,eAAA,GAAkB,GAAA,GAAM,cAAA,GAAiB,eAAA;AAE5E,EAAA,MAAM,SAAS,uBAAA,KAA4B,MAAA;AAE3C,EAAA,uBACIF,GAAAA;AAAA,IAACI,WAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,OACI,KAAA,IAAS;AAAA,QACL,EAAA;AAAA,QACA,KAAA,EAAO,eAAA;AAAA,QACP,SAAA;AAAA,QACA,cAAA;AAAA,QACA,UAAA;AAAA,QACA,IAAA,EAAM;AAAA,OACV;AAAA,MAEJ,SAAA;AAAA,MACA,UAAA;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,SAAA,EAAW,CAAC,KAAA,KACR,EAAA,CAAG,+BAA+B,IAAA,KAAS,IAAA,GAAO,MAAA,GAAS,QAAA,EAAU,OAAO,SAAA,KAAc,UAAA,GAAa,SAAA,CAAU,KAAK,IAAI,SAAS,CAAA;AAAA,MAGtI,QAAA,EAAA,CAAC,0BACEH,IAAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACG,SAAA,EAAW,EAAA;AAAA,YACP,wEAAA;AAAA,YAAA,CACC,MAAM,SAAA,IAAa,KAAA,CAAM,aAAc,KAAA,CAAM,UAAA,IAAc,uBAAuB,UAAA,KAAgB,kBAAA;AAAA,YACnG,MAAM,UAAA,IAAc,+BAAA;AAAA;AAAA,YAGpB,qDAAA;AAAA,YAEAC,MAAAA,CAAM,IAAI,CAAA,CAAE;AAAA,WAChB;AAAA,UAEC,QAAA,EAAA;AAAA,YAAA,MAAA,IAAU,kBAAA,KAAuB,UAAA,oBAC9BF,GAAAA,CAAC,gBAAa,IAAA,EAAME,MAAAA,CAAM,IAAI,CAAA,CAAE,UAAU,UAAA,EAAY,KAAA,CAAM,UAAA,EAAY,UAAA,EAAY,MAAM,UAAA,EAAY,CAAA;AAAA,YAGzG,SAAA,mBACGF,GAAAA,CAAC,MAAA,EAAA,EAAO,eAAY,MAAA,EAAO,IAAA,EAAK,IAAA,EAAK,GAAA,EAAK,SAAA,EAAW,GAAA,EAAK,KAAA,EAAO,SAAA,EAAW,GAAG,IAAA,KAAS,IAAA,IAAQ,QAAQ,CAAA,EAAG,CAAA,GAC3G,gBAAA,CAAiB,IAAI,CAAA,mBACrBA,GAAAA,CAAC,IAAA,EAAA,EAAK,WAAA,EAAS,IAAA,EAAC,eAAY,MAAA,EAAO,CAAA,GACnC,cAAA,CAAe,IAAI,IACnB,IAAA,GACA,IAAA;AAAA,4BAEJC,IAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,wCAAwCC,MAAAA,CAAM,IAAI,CAAA,CAAE,aAAa,CAAA,EAChF,QAAA,EAAA;AAAA,8BAAAF,IAACK,IAAA,EAAA,EAAS,IAAA,EAAK,SAAQ,SAAA,EAAW,EAAA,CAAG,uDAAuDH,MAAAA,CAAM,IAAI,EAAE,IAAI,CAAA,EACvG,oBAAU,OAAO,QAAA,KAAa,aAAa,QAAA,CAAS,KAAK,IAAI,QAAA,CAAA,EAClE,CAAA;AAAA,cAEC,cAAA,oBACGF,GAAAA,CAACK,IAAA,EAAA,EAAS,MAAK,aAAA,EAAc,SAAA,EAAW,EAAA,CAAG,iCAAA,EAAmCH,MAAAA,CAAM,IAAI,CAAA,CAAE,IAAI,GACzF,QAAA,EAAA,cAAA,EACL;AAAA,aAAA,EAER,CAAA;AAAA,YAEC,MAAM,UAAA,IAAc,kBAAA,KAAuB,WAAA,oBACxCF,IAACM,SAAA,EAAA,EAAM,aAAA,EAAY,MAAA,EAAO,SAAA,EAAW,GAAG,+BAAA,EAAiCJ,MAAAA,CAAM,IAAI,CAAA,CAAE,KAAK,CAAA,EAAG,CAAA;AAAA,YAGhG,CAAC,MAAA,IAAU,kBAAA,KAAuB,8BAC/BF,GAAAA,CAAC,gBAAa,IAAA,EAAME,MAAAA,CAAM,IAAI,CAAA,CAAE,QAAA,EAAU,YAAY,KAAA,CAAM,UAAA,EAAY,YAAY,KAAA,CAAM,UAAA,EAAY,WAAU,SAAA,EAAU;AAAA;AAAA;AAAA;AAElI;AAAA,GAER;AAER","file":"select-item.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n extend: {\n theme: {\n text: [\"display-xs\", \"display-sm\", \"display-md\", \"display-lg\", \"display-xl\", \"display-2xl\"],\n },\n },\n});\n\n/**\n * This function is a wrapper around the twMerge function.\n * It is used to merge the classes inside style objects.\n */\nexport const cx = twMerge;\n\n/**\n * This function does nothing besides helping us to be able to\n * sort the classes inside style objects which is not supported\n * by the Tailwind IntelliSense by default.\n */\nexport function sortCx<T extends Record<string, string | number | Record<string, string | number | Record<string, string | number>>>>(classes: T): T {\n return classes;\n}\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\nconst sizes = {\n xs: \"size-1.5\",\n sm: \"size-2\",\n md: \"size-2.5\",\n lg: \"size-3\",\n xl: \"size-3.5\",\n \"2xl\": \"size-4\",\n \"3xl\": \"size-4.5\",\n \"4xl\": \"size-5\",\n};\n\ninterface AvatarOnlineIndicatorProps {\n size: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\";\n status: \"online\" | \"offline\";\n className?: string;\n}\n\nexport const AvatarOnlineIndicator = ({ size, status, className }: AvatarOnlineIndicatorProps) => (\n <span\n className={cx(\n \"absolute right-0 bottom-0 flex justify-center rounded-full ring-[1.5px] ring-bg-primary\",\n status === \"online\" ? \"bg-fg-success-secondary\" : \"bg-utility-neutral-300\",\n sizes[size],\n className,\n )}\n style={{\n backgroundImage:\n \"radial-gradient(43.75% 43.75% at 50% 28.75%, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.00) 74.66%, rgba(255, 255, 255, 0.18) 100%), radial-gradient(75% 75% at 50% 0%, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.00) 50%, rgba(255, 255, 255, 0.08) 99%, rgba(255, 255, 255, 0.00) 100%)\",\n }}\n >\n {/* Reflection */}\n <svg viewBox=\"0 0 7.2 2.85\" fill=\"none\" className=\"mt-[10%] h-[20%] w-[60%]\">\n <path\n d=\"M7.2 1.83107C7.2 2.84235 5.58823 2.19729 3.6 2.19729C1.61177 2.19729 0 2.84235 0 1.83107C0 0.8198 1.61177 0 3.6 0C5.58823 0 7.2 0.8198 7.2 1.83107Z\"\n fill=\"url(#reflection-gradient)\"\n fillOpacity=\"0.4\"\n />\n <defs>\n <linearGradient id=\"reflection-gradient\" x1=\"3.6\" y1=\"0\" x2=\"3.6\" y2=\"2.4\" gradientUnits=\"userSpaceOnUse\">\n <stop stopColor=\"white\" />\n <stop offset=\"1\" stopColor=\"white\" stopOpacity=\"0.1\" />\n </linearGradient>\n </defs>\n </svg>\n </span>\n);\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\nconst sizes = {\n xs: \"size-2.5\",\n sm: \"size-3\",\n md: \"size-3.5\",\n lg: \"size-4\",\n xl: \"size-4.5\",\n \"2xl\": \"size-5\",\n \"3xl\": \"size-6\",\n \"4xl\": \"size-8\",\n};\n\ninterface VerifiedTickProps {\n size: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\";\n className?: string;\n}\n\nexport const VerifiedTick = ({ size, className }: VerifiedTickProps) => (\n <svg className={cx(\"z-10 text-utility-blue-500\", sizes[size], className)} viewBox=\"0 0 10 10\" fill=\"none\">\n <path\n d=\"M7.72237 1.77098C7.81734 2.00068 7.99965 2.18326 8.2292 2.27858L9.03413 2.61199C9.26384 2.70714 9.44635 2.88965 9.5415 3.11936C9.63665 3.34908 9.63665 3.60718 9.5415 3.83689L9.20833 4.64125C9.11313 4.87106 9.113 5.12943 9.20863 5.35913L9.54122 6.16325C9.58839 6.27702 9.61268 6.39897 9.6127 6.52214C9.61272 6.6453 9.58847 6.76726 9.54134 6.88105C9.4942 6.99484 9.42511 7.09823 9.33801 7.18531C9.2509 7.27238 9.14749 7.34144 9.03369 7.38854L8.22934 7.72171C7.99964 7.81669 7.81706 7.99899 7.72174 8.22855L7.38833 9.03348C7.29318 9.26319 7.11067 9.4457 6.88096 9.54085C6.65124 9.636 6.39314 9.636 6.16343 9.54085L5.35907 9.20767C5.12935 9.11276 4.87134 9.11295 4.64177 9.20821L3.83684 9.54115C3.60725 9.63608 3.34937 9.636 3.11984 9.54092C2.89032 9.44585 2.70791 9.26356 2.6127 9.03409L2.27918 8.22892C2.18421 7.99923 2.0019 7.81665 1.77235 7.72133L0.967421 7.38792C0.737807 7.29281 0.555355 7.11041 0.460169 6.88083C0.364983 6.65125 0.364854 6.39327 0.45981 6.16359L0.792984 5.35924C0.8879 5.12952 0.887707 4.87151 0.792445 4.64193L0.459749 3.83642C0.41258 3.72265 0.388291 3.60069 0.388272 3.47753C0.388252 3.35436 0.412501 3.2324 0.459634 3.11861C0.506767 3.00482 0.57586 2.90144 0.662965 2.81436C0.75007 2.72728 0.853479 2.65822 0.967283 2.61113L1.77164 2.27795C2.00113 2.18306 2.1836 2.00099 2.27899 1.7717L2.6124 0.966768C2.70755 0.737054 2.89006 0.554547 3.11978 0.459397C3.34949 0.364246 3.60759 0.364246 3.83731 0.459397L4.64166 0.792571C4.87138 0.887487 5.12939 0.887293 5.35897 0.792031L6.16424 0.459913C6.39392 0.364816 6.65197 0.364836 6.88164 0.459968C7.11131 0.555099 7.29379 0.737554 7.38895 0.967208L7.72247 1.77238L7.72237 1.77098Z\"\n className=\"fill-current\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M6.95829 3.68932C7.02509 3.58439 7.04747 3.45723 7.02051 3.3358C6.99356 3.21437 6.91946 3.10862 6.81454 3.04182C6.70961 2.97502 6.58245 2.95264 6.46102 2.97959C6.33959 3.00655 6.23384 3.08064 6.16704 3.18557L4.33141 6.06995L3.49141 5.01995C3.41375 4.92281 3.30069 4.8605 3.17709 4.84673C3.05349 4.83296 2.92949 4.86885 2.83235 4.94651C2.73522 5.02417 2.67291 5.13723 2.65914 5.26083C2.64536 5.38443 2.68125 5.50843 2.75891 5.60557L4.00891 7.16807C4.0555 7.22638 4.11533 7.27271 4.18344 7.30323C4.25154 7.33375 4.32595 7.34757 4.40047 7.34353C4.47499 7.3395 4.54747 7.31773 4.61188 7.28004C4.67629 7.24234 4.73077 7.18981 4.77079 7.12682L6.95829 3.68932Z\"\n fill=\"white\"\n />\n </svg>\n);\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\ninterface AvatarCountProps {\n count: number;\n className?: string;\n}\n\nexport const AvatarCount = ({ count, className }: AvatarCountProps) => (\n <div className={cx(\"absolute right-0 bottom-0 p-px\", className)}>\n <div className=\"flex size-3.5 items-center justify-center rounded-full bg-fg-error-primary text-center text-[10px] leading-[13px] font-bold text-white\">\n {count}\n </div>\n </div>\n);\n","\"use client\";\n\n/** Figma: Avatar (18:1350) */\n\nimport { type FC, type ReactNode, useState } from \"react\";\nimport { UserIcon as User01 } from \"@phosphor-icons/react/dist/csr/User\";\nimport { cx } from \"@/utils/cx\";\nimport { AvatarOnlineIndicator, VerifiedTick } from \"./base-components\";\nimport { AvatarCount } from \"./base-components/avatar-count\";\n\nexport interface AvatarProps {\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\n className?: string;\n /**\n * The class name for the main child of the avatar.\n */\n contentClassName?: string;\n src?: string | null;\n alt?: string;\n /**\n * Display an inner contrast border around the avatar image.\n */\n contrastBorder?: boolean;\n /**\n * Whether the avatar should be rounded.\n * @default true\n */\n rounded?: boolean;\n /**\n * Display an outer border around the avatar.\n */\n border?: boolean;\n /**\n * Display a badge (i.e. company logo).\n */\n badge?: ReactNode;\n /**\n * Display a status indicator.\n */\n status?: \"online\" | \"offline\";\n /**\n * Display a verified tick icon.\n *\n * @default false\n */\n verified?: boolean;\n /**\n * Display a count badge.\n */\n count?: number;\n /**\n * The initials of the user to display if no image is available.\n */\n initials?: string;\n /**\n * An icon to display if no image is available.\n */\n placeholderIcon?: FC<{ className?: string }>;\n /**\n * A placeholder to display if no image is available.\n */\n placeholder?: ReactNode;\n\n /**\n * Whether the avatar should show a focus ring when the parent group is in focus.\n * For example, when the avatar is wrapped inside a link.\n *\n * @default false\n */\n focusable?: boolean;\n}\n\nconst styles = {\n xs: { root: \"size-6\", rootWithBorder: \"p-px\", initials: \"text-xs font-semibold\", icon: \"size-4\" },\n sm: { root: \"size-8\", rootWithBorder: \"p-px\", initials: \"text-sm font-semibold\", icon: \"size-5\" },\n md: { root: \"size-10\", rootWithBorder: \"p-px\", initials: \"text-md font-semibold\", icon: \"size-6\" },\n lg: { root: \"size-12\", rootWithBorder: \"p-[1.5px]\", initials: \"text-lg font-semibold\", icon: \"size-7\" },\n xl: { root: \"size-14\", rootWithBorder: \"p-0.5\", initials: \"text-xl font-semibold\", icon: \"size-8\" },\n \"2xl\": { root: \"size-16\", rootWithBorder: \"p-0.5\", initials: \"text-display-xs font-semibold\", icon: \"size-8\" },\n};\n\nexport const Avatar = ({\n size = \"md\",\n src,\n alt,\n initials,\n placeholder,\n placeholderIcon: PlaceholderIcon,\n border,\n badge,\n status,\n verified,\n count,\n focusable = false,\n rounded = true,\n className,\n contentClassName,\n}: AvatarProps) => {\n const [isFailed, setIsFailed] = useState(false);\n\n const canShowImage = src && !isFailed;\n\n const renderMainContent = () => {\n if (canShowImage) {\n return <img data-avatar-img className=\"size-full object-cover\" src={src} alt={alt} onError={() => setIsFailed(true)} />;\n }\n\n if (initials) {\n return <span className={cx(\"text-quaternary\", styles[size].initials)}>{initials}</span>;\n }\n\n if (PlaceholderIcon) {\n return <PlaceholderIcon className={cx(\"text-fg-quaternary\", styles[size].icon)} />;\n }\n\n return placeholder || <User01 className={cx(\"text-fg-quaternary\", styles[size].icon)} />;\n };\n\n const renderBadgeContent = () => {\n if (status) {\n return <AvatarOnlineIndicator status={status} size={size} />;\n }\n\n if (verified) {\n return <VerifiedTick size={size} className={cx(\"absolute right-0 bottom-0\", size === \"xs\" && \"-right-px -bottom-px\")} />;\n }\n\n if (count) {\n return <AvatarCount count={count} />;\n }\n\n return badge;\n };\n\n return (\n <div\n data-avatar\n className={cx(\n \"relative inline-flex shrink-0 rounded-[7px]\",\n rounded && \"rounded-full\",\n // Focus styles\n focusable &&\n \"outline-none group-focus-visible:[box-shadow:0px_0px_0px_2px_var(--color-bg-primary),0px_0px_0px_4px_var(--color-focus-ring)]\",\n border && \"ring-1 ring-secondary_alt\",\n border && styles[size].rootWithBorder,\n styles[size].root,\n className,\n )}\n >\n <div\n className={cx(\n \"relative inline-flex size-full shrink-0 items-center justify-center overflow-hidden rounded-md bg-tertiary outline-[0.5px] -outline-offset-[0.5px] outline-black/16 before:inset-[0.5px]\",\n rounded && \"rounded-full\",\n canShowImage &&\n size !== \"xs\" &&\n \"before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-white/32 before:mask-[linear-gradient(to_bottom,black_0%,transparent_25%,transparent_75%,black_100%)]\",\n contentClassName,\n )}\n >\n {renderMainContent()}\n </div>\n {renderBadgeContent()}\n </div>\n );\n};\n","\"use client\";\n\nimport { useLayoutEffect, useRef, type ReactNode, type Ref } from \"react\";\nimport { Checkbox as AriaCheckbox, type CheckboxProps as AriaCheckboxProps } from \"react-aria-components\";\nimport { cx } from \"@/utils/cx\";\n\nconst CHECKBOX_TICK_DELAY_MS = 60;\nconst CHECKBOX_TICK_DRAW_MS = 100;\n\n/** Draw-on-check tick animation — remounts when checked so it replays each time. */\nfunction CheckboxAnimatedCheckMark({ className }: { className?: string }) {\n const pathRef = useRef<SVGPathElement>(null);\n\n useLayoutEffect(() => {\n const path = pathRef.current;\n if (!path || typeof path.getTotalLength !== \"function\") return;\n const len = path.getTotalLength();\n if (len <= 0) return;\n\n path.style.strokeDasharray = `${len}`;\n path.style.strokeDashoffset = `${len}`;\n\n if (typeof path.animate !== \"function\") {\n path.style.strokeDashoffset = \"0\";\n return;\n }\n\n const anim = path.animate([{ strokeDashoffset: len }, { strokeDashoffset: 0 }], {\n duration: CHECKBOX_TICK_DRAW_MS,\n delay: CHECKBOX_TICK_DELAY_MS,\n easing: \"cubic-bezier(0.45, 0, 0.2, 1)\",\n fill: \"forwards\",\n });\n return () => anim.cancel();\n }, []);\n\n return (\n <svg aria-hidden=\"true\" viewBox=\"0 0 14 14\" fill=\"none\" className={cx(\"block shrink-0\", className)}>\n <path\n ref={pathRef}\n d=\"M2.33325 7L5.24992 9.91667L11.6666 3.5\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\n/** Figma Focus rings/focus-ring — 2px surface gap + 4px brand ring (matches Button). */\nconst focusRingShadow =\n \"outline-none [box-shadow:0px_0px_0px_2px_var(--color-bg-primary),0px_0px_0px_4px_var(--color-focus-ring)]\";\n\nexport interface CheckboxBaseProps {\n size?: \"sm\" | \"md\";\n className?: string;\n isFocusVisible?: boolean;\n isSelected?: boolean;\n isDisabled?: boolean;\n isIndeterminate?: boolean;\n}\n\nexport const CheckboxBase = ({ className, isSelected, isDisabled, isIndeterminate, size = \"sm\", isFocusVisible = false }: CheckboxBaseProps) => {\n const isChecked = isSelected || isIndeterminate;\n const iconClassName = size === \"sm\" ? \"size-2.5\" : \"size-3.5\";\n\n return (\n <div\n className={cx(\n \"relative flex shrink-0 cursor-pointer appearance-none items-center justify-center border border-solid border-primary\",\n size === \"sm\" ? \"size-4 rounded-xs\" : \"size-5 rounded-sm\",\n isChecked ? \"border-transparent bg-brand-solid\" : \"bg-primary\",\n isDisabled && \"cursor-not-allowed opacity-50\",\n isDisabled && !isChecked && \"bg-tertiary\",\n isFocusVisible && !isDisabled && focusRingShadow,\n className,\n )}\n >\n {isIndeterminate && (\n <svg\n aria-hidden=\"true\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n className={cx(\"pointer-events-none block shrink-0 text-fg-white\", iconClassName)}\n >\n <path d=\"M2.91675 7H11.0834\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )}\n\n {isSelected && !isIndeterminate && (\n <CheckboxAnimatedCheckMark className={cx(\"pointer-events-none text-fg-white\", iconClassName)} />\n )}\n </div>\n );\n};\nCheckboxBase.displayName = \"CheckboxBase\";\n\ninterface CheckboxProps extends AriaCheckboxProps {\n ref?: Ref<HTMLLabelElement>;\n size?: \"sm\" | \"md\";\n label?: ReactNode;\n hint?: ReactNode;\n}\n\nexport const Checkbox = ({ label, hint, size = \"sm\", className, ...ariaCheckboxProps }: CheckboxProps) => {\n const sizes = {\n sm: {\n root: \"gap-2\",\n textWrapper: \"\",\n label: \"text-sm font-medium\",\n hint: \"text-sm\",\n },\n md: {\n root: \"gap-3\",\n textWrapper: \"gap-0.5 break-words\",\n label: \"text-md font-medium\",\n hint: \"text-md\",\n },\n };\n\n return (\n <AriaCheckbox\n {...ariaCheckboxProps}\n className={(state) =>\n cx(\n \"relative flex items-start\",\n state.isDisabled && \"cursor-not-allowed\",\n sizes[size].root,\n typeof className === \"function\" ? className(state) : className,\n )\n }\n >\n {({ isSelected, isIndeterminate, isDisabled, isFocusVisible }) => (\n <>\n <CheckboxBase\n size={size}\n isSelected={isSelected}\n isIndeterminate={isIndeterminate}\n isDisabled={isDisabled}\n isFocusVisible={isFocusVisible}\n className={label || hint ? \"mt-0.5\" : \"\"}\n />\n {(label || hint) && (\n <div className={cx(\"inline-flex flex-col\", sizes[size].textWrapper)}>\n {label && <p className={cx(\"text-secondary select-none\", sizes[size].label)}>{label}</p>}\n {hint && (\n <span className={cx(\"text-tertiary\", sizes[size].hint)} onClick={(event) => event.stopPropagation()}>\n {hint}\n </span>\n )}\n </div>\n )}\n </>\n )}\n </AriaCheckbox>\n );\n};\nCheckbox.displayName = \"Checkbox\";\n","/* We cannot use type `unknown` instead of `any` here because it will break the type assertion `isReactComponent` function is providing. */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type React from \"react\";\n\ntype ReactComponent = React.FC<any> | React.ComponentClass<any, any>;\n\n/**\n * Checks if a given value is a function component.\n */\nexport const isFunctionComponent = (component: any): component is React.FC<any> => {\n return typeof component === \"function\";\n};\n\n/**\n * Checks if a given value is a class component.\n */\nexport const isClassComponent = (component: any): component is React.ComponentClass<any, any> => {\n return typeof component === \"function\" && component.prototype && (!!component.prototype.isReactComponent || !!component.prototype.render);\n};\n\n/**\n * Checks if a given value is a forward ref component.\n */\nexport const isForwardRefComponent = (component: any): component is React.ForwardRefExoticComponent<any> => {\n return typeof component === \"object\" && component !== null && component.$$typeof.toString() === \"Symbol(react.forward_ref)\";\n};\n\n/**\n * Checks if a given value is a valid React component.\n */\nexport const isReactComponent = (component: any): component is ReactComponent => {\n return isFunctionComponent(component) || isForwardRefComponent(component) || isClassComponent(component);\n};\n","\"use client\";\n\nimport type { FC, ReactNode } from \"react\";\nimport { createContext } from \"react\";\n\nexport type SelectItemType = {\n /** Unique identifier for the item. */\n id: string | number;\n /** The primary display text. */\n label?: string;\n /** Avatar image URL. */\n avatarUrl?: string;\n /** Whether the item is disabled. */\n isDisabled?: boolean;\n /** Secondary text displayed alongside the label. */\n supportingText?: string;\n /** Leading icon component or element. */\n icon?: FC | ReactNode;\n};\n\nexport interface CommonProps {\n /** Helper text displayed below the input. */\n hint?: string;\n /** Field label displayed above the input. */\n label?: string;\n /** Tooltip text for the help icon next to the label. */\n tooltip?: string;\n /**\n * The size of the component.\n * @default \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n /** Placeholder text when no value is selected. */\n placeholder?: string;\n /** Whether to hide the required indicator from the label. */\n hideRequiredIndicator?: boolean;\n}\n\nexport const sizes = {\n sm: {\n root: \"py-2 pl-3 pr-2.5 gap-2 *:data-icon:size-4 *:data-icon:stroke-[2.25px]\",\n withIcon: \"\",\n text: \"text-sm\",\n textContainer: \"gap-x-1.5\",\n shortcut: \"pr-2.5\",\n },\n md: { root: \"py-2 px-3 gap-2 *:data-icon:size-5\", withIcon: \"\", text: \"text-md\", textContainer: \"gap-x-1.5\", shortcut: \"pr-2.5\" },\n lg: { root: \"py-2.5 px-3.5 gap-2 *:data-icon:size-5\", withIcon: \"\", text: \"text-md\", textContainer: \"gap-x-1.5\", shortcut: \"pr-3\" },\n};\n\nexport const SelectContext = createContext<{ size: \"sm\" | \"md\" | \"lg\" }>({ size: \"md\" });\n","\"use client\";\n\n/** Figma: Select item (11132:11643) — hover/focus use bg-primary_hover; checkbox uses CheckboxBase. */\n\nimport { isValidElement, useContext } from \"react\";\nimport { CheckIcon as Check } from \"@phosphor-icons/react/dist/csr/Check\";\nimport type { ListBoxItemProps as AriaListBoxItemProps } from \"react-aria-components\";\nimport { ListBoxItem as AriaListBoxItem, Text as AriaText } from \"react-aria-components\";\nimport { Avatar } from \"@/components/base/avatar/avatar\";\nimport { CheckboxBase } from \"@/components/base/checkbox/checkbox\";\nimport { cx } from \"@/utils/cx\";\nimport { isReactComponent } from \"@/utils/is-react-component\";\nimport type { SelectItemType } from \"./select-shared\";\nimport { SelectContext } from \"./select-shared\";\n\nconst sizes = {\n sm: {\n root: \"p-2 pr-2.5 gap-2 *:data-icon:size-4 *:data-icon:stroke-[2.25px]\",\n text: \"text-sm\",\n textContainer: \"gap-x-1.5\",\n check: \"size-4 stroke-[2.25px]\",\n checkbox: \"sm\" as const,\n },\n md: {\n root: \"p-2 pr-2.5 gap-2 *:data-icon:size-5\",\n text: \"text-md\",\n textContainer: \"gap-x-2\",\n check: \"size-5\",\n checkbox: \"sm\" as const,\n },\n lg: {\n root: \"p-2.5 pl-2 gap-2 *:data-icon:size-5\",\n text: \"text-md\",\n textContainer: \"gap-x-2\",\n check: \"size-5\",\n checkbox: \"md\" as const,\n },\n};\n\ninterface SelectItemProps extends Omit<AriaListBoxItemProps<SelectItemType>, \"id\">, SelectItemType {\n /** The selection indicator to be displayed on the item. */\n selectionIndicator?: \"checkmark\" | \"checkbox\" | \"none\";\n /** The alignment of the selection indicator. */\n selectionIndicatorAlign?: \"left\" | \"right\";\n}\n\nexport const SelectItem = ({\n label,\n id,\n value,\n avatarUrl,\n supportingText,\n isDisabled,\n icon: Icon,\n className,\n children,\n selectionIndicator = \"checkmark\",\n selectionIndicatorAlign = \"right\",\n ...props\n}: SelectItemProps) => {\n const { size } = useContext(SelectContext);\n\n const labelOrChildren = label || (typeof children === \"string\" ? children : \"\");\n const textValue = supportingText ? labelOrChildren + \" \" + supportingText : labelOrChildren;\n\n const isLeft = selectionIndicatorAlign === \"left\";\n\n return (\n <AriaListBoxItem\n id={id}\n value={\n value ?? {\n id,\n label: labelOrChildren,\n avatarUrl,\n supportingText,\n isDisabled,\n icon: Icon,\n }\n }\n textValue={textValue}\n isDisabled={isDisabled}\n {...props}\n className={(state) =>\n cx(\"w-full py-px outline-hidden\", size === \"sm\" ? \"px-1\" : \"px-1.5\", typeof className === \"function\" ? className(state) : className)\n }\n >\n {(state) => (\n <div\n className={cx(\n \"flex cursor-pointer items-center rounded-md outline-hidden select-none\",\n (state.isFocused || state.isHovered || (state.isSelected && selectionIndicator !== \"checkbox\")) && \"bg-primary_hover\",\n state.isDisabled && \"cursor-not-allowed opacity-50\",\n\n // Icon styles\n \"*:data-icon:shrink-0 *:data-icon:text-fg-quaternary\",\n\n sizes[size].root,\n )}\n >\n {isLeft && selectionIndicator === \"checkbox\" && (\n <CheckboxBase size={sizes[size].checkbox} isSelected={state.isSelected} isDisabled={state.isDisabled} />\n )}\n\n {avatarUrl ? (\n <Avatar aria-hidden=\"true\" size=\"xs\" src={avatarUrl} alt={label} className={cx(size === \"sm\" && \"size-5\")} />\n ) : isReactComponent(Icon) ? (\n <Icon data-icon aria-hidden=\"true\" />\n ) : isValidElement(Icon) ? (\n Icon\n ) : null}\n\n <div className={cx(\"flex w-full min-w-0 flex-1 flex-wrap\", sizes[size].textContainer)}>\n <AriaText slot=\"label\" className={cx(\"truncate font-medium whitespace-nowrap text-primary\", sizes[size].text)}>\n {label || (typeof children === \"function\" ? children(state) : children)}\n </AriaText>\n\n {supportingText && (\n <AriaText slot=\"description\" className={cx(\"whitespace-nowrap text-tertiary\", sizes[size].text)}>\n {supportingText}\n </AriaText>\n )}\n </div>\n\n {state.isSelected && selectionIndicator === \"checkmark\" && (\n <Check aria-hidden=\"true\" className={cx(\"ml-auto text-fg-brand-primary\", sizes[size].check)} />\n )}\n\n {!isLeft && selectionIndicator === \"checkbox\" && (\n <CheckboxBase size={sizes[size].checkbox} isSelected={state.isSelected} isDisabled={state.isDisabled} className=\"ml-auto\" />\n )}\n </div>\n )}\n </AriaListBoxItem>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../../../../utils/cx.ts","../../../../components/base/avatar/base-components/avatar-online-indicator.tsx","../../../../components/base/avatar/base-components/verified-tick.tsx","../../../../components/base/avatar/base-components/avatar-count.tsx","../../../../components/base/avatar/avatar.tsx","../../../../components/base/checkbox/checkbox.tsx","../../../../utils/is-react-component.ts","../../../../components/base/select/select-shared.tsx","../../../../components/base/select/select-item.tsx"],"names":["jsx","jsxs","sizes","User01","AriaListBoxItem","AriaText","Check"],"mappings":"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","file":"select-item.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n extend: {\n theme: {\n text: [\"display-xs\", \"display-sm\", \"display-md\", \"display-lg\", \"display-xl\", \"display-2xl\"],\n },\n },\n});\n\n/**\n * This function is a wrapper around the twMerge function.\n * It is used to merge the classes inside style objects.\n */\nexport const cx = twMerge;\n\n/**\n * This function does nothing besides helping us to be able to\n * sort the classes inside style objects which is not supported\n * by the Tailwind IntelliSense by default.\n */\nexport function sortCx<T extends Record<string, string | number | Record<string, string | number | Record<string, string | number>>>>(classes: T): T {\n return classes;\n}\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\nconst sizes = {\n xs: \"size-1.5\",\n sm: \"size-2\",\n md: \"size-2.5\",\n lg: \"size-3\",\n xl: \"size-3.5\",\n \"2xl\": \"size-4\",\n \"3xl\": \"size-4.5\",\n \"4xl\": \"size-5\",\n};\n\ninterface AvatarOnlineIndicatorProps {\n size: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\";\n status: \"online\" | \"offline\";\n className?: string;\n}\n\nexport const AvatarOnlineIndicator = ({ size, status, className }: AvatarOnlineIndicatorProps) => (\n <span\n className={cx(\n \"absolute right-0 bottom-0 flex justify-center rounded-full ring-[1.5px] ring-bg-primary\",\n status === \"online\" ? \"bg-fg-success-secondary\" : \"bg-utility-neutral-300\",\n sizes[size],\n className,\n )}\n style={{\n backgroundImage:\n \"radial-gradient(43.75% 43.75% at 50% 28.75%, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.00) 74.66%, rgba(255, 255, 255, 0.18) 100%), radial-gradient(75% 75% at 50% 0%, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.00) 50%, rgba(255, 255, 255, 0.08) 99%, rgba(255, 255, 255, 0.00) 100%)\",\n }}\n >\n {/* Reflection */}\n <svg viewBox=\"0 0 7.2 2.85\" fill=\"none\" className=\"mt-[10%] h-[20%] w-[60%]\">\n <path\n d=\"M7.2 1.83107C7.2 2.84235 5.58823 2.19729 3.6 2.19729C1.61177 2.19729 0 2.84235 0 1.83107C0 0.8198 1.61177 0 3.6 0C5.58823 0 7.2 0.8198 7.2 1.83107Z\"\n fill=\"url(#reflection-gradient)\"\n fillOpacity=\"0.4\"\n />\n <defs>\n <linearGradient id=\"reflection-gradient\" x1=\"3.6\" y1=\"0\" x2=\"3.6\" y2=\"2.4\" gradientUnits=\"userSpaceOnUse\">\n <stop stopColor=\"white\" />\n <stop offset=\"1\" stopColor=\"white\" stopOpacity=\"0.1\" />\n </linearGradient>\n </defs>\n </svg>\n </span>\n);\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\nconst sizes = {\n xs: \"size-2.5\",\n sm: \"size-3\",\n md: \"size-3.5\",\n lg: \"size-4\",\n xl: \"size-4.5\",\n \"2xl\": \"size-5\",\n \"3xl\": \"size-6\",\n \"4xl\": \"size-8\",\n};\n\ninterface VerifiedTickProps {\n size: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\";\n className?: string;\n}\n\nexport const VerifiedTick = ({ size, className }: VerifiedTickProps) => (\n <svg className={cx(\"z-10 text-utility-blue-500\", sizes[size], className)} viewBox=\"0 0 10 10\" fill=\"none\">\n <path\n d=\"M7.72237 1.77098C7.81734 2.00068 7.99965 2.18326 8.2292 2.27858L9.03413 2.61199C9.26384 2.70714 9.44635 2.88965 9.5415 3.11936C9.63665 3.34908 9.63665 3.60718 9.5415 3.83689L9.20833 4.64125C9.11313 4.87106 9.113 5.12943 9.20863 5.35913L9.54122 6.16325C9.58839 6.27702 9.61268 6.39897 9.6127 6.52214C9.61272 6.6453 9.58847 6.76726 9.54134 6.88105C9.4942 6.99484 9.42511 7.09823 9.33801 7.18531C9.2509 7.27238 9.14749 7.34144 9.03369 7.38854L8.22934 7.72171C7.99964 7.81669 7.81706 7.99899 7.72174 8.22855L7.38833 9.03348C7.29318 9.26319 7.11067 9.4457 6.88096 9.54085C6.65124 9.636 6.39314 9.636 6.16343 9.54085L5.35907 9.20767C5.12935 9.11276 4.87134 9.11295 4.64177 9.20821L3.83684 9.54115C3.60725 9.63608 3.34937 9.636 3.11984 9.54092C2.89032 9.44585 2.70791 9.26356 2.6127 9.03409L2.27918 8.22892C2.18421 7.99923 2.0019 7.81665 1.77235 7.72133L0.967421 7.38792C0.737807 7.29281 0.555355 7.11041 0.460169 6.88083C0.364983 6.65125 0.364854 6.39327 0.45981 6.16359L0.792984 5.35924C0.8879 5.12952 0.887707 4.87151 0.792445 4.64193L0.459749 3.83642C0.41258 3.72265 0.388291 3.60069 0.388272 3.47753C0.388252 3.35436 0.412501 3.2324 0.459634 3.11861C0.506767 3.00482 0.57586 2.90144 0.662965 2.81436C0.75007 2.72728 0.853479 2.65822 0.967283 2.61113L1.77164 2.27795C2.00113 2.18306 2.1836 2.00099 2.27899 1.7717L2.6124 0.966768C2.70755 0.737054 2.89006 0.554547 3.11978 0.459397C3.34949 0.364246 3.60759 0.364246 3.83731 0.459397L4.64166 0.792571C4.87138 0.887487 5.12939 0.887293 5.35897 0.792031L6.16424 0.459913C6.39392 0.364816 6.65197 0.364836 6.88164 0.459968C7.11131 0.555099 7.29379 0.737554 7.38895 0.967208L7.72247 1.77238L7.72237 1.77098Z\"\n className=\"fill-current\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M6.95829 3.68932C7.02509 3.58439 7.04747 3.45723 7.02051 3.3358C6.99356 3.21437 6.91946 3.10862 6.81454 3.04182C6.70961 2.97502 6.58245 2.95264 6.46102 2.97959C6.33959 3.00655 6.23384 3.08064 6.16704 3.18557L4.33141 6.06995L3.49141 5.01995C3.41375 4.92281 3.30069 4.8605 3.17709 4.84673C3.05349 4.83296 2.92949 4.86885 2.83235 4.94651C2.73522 5.02417 2.67291 5.13723 2.65914 5.26083C2.64536 5.38443 2.68125 5.50843 2.75891 5.60557L4.00891 7.16807C4.0555 7.22638 4.11533 7.27271 4.18344 7.30323C4.25154 7.33375 4.32595 7.34757 4.40047 7.34353C4.47499 7.3395 4.54747 7.31773 4.61188 7.28004C4.67629 7.24234 4.73077 7.18981 4.77079 7.12682L6.95829 3.68932Z\"\n fill=\"white\"\n />\n </svg>\n);\n","\"use client\";\n\nimport { cx } from \"@/utils/cx\";\n\ninterface AvatarCountProps {\n count: number;\n className?: string;\n}\n\nexport const AvatarCount = ({ count, className }: AvatarCountProps) => (\n <div className={cx(\"absolute right-0 bottom-0 p-px\", className)}>\n <div className=\"flex size-3.5 items-center justify-center rounded-full bg-fg-error-primary text-center text-[10px] leading-[13px] font-bold text-white\">\n {count}\n </div>\n </div>\n);\n","\"use client\";\n\n/** Figma: Avatar (18:1350) */\n\nimport { type FC, type ReactNode, useState } from \"react\";\nimport { UserIcon as User01 } from \"@phosphor-icons/react/dist/csr/User\";\nimport { cx } from \"@/utils/cx\";\nimport { AvatarOnlineIndicator, VerifiedTick } from \"./base-components\";\nimport { AvatarCount } from \"./base-components/avatar-count\";\n\nexport interface AvatarProps {\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\n className?: string;\n /**\n * The class name for the main child of the avatar.\n */\n contentClassName?: string;\n src?: string | null;\n alt?: string;\n /**\n * Display an inner contrast border around the avatar image.\n */\n contrastBorder?: boolean;\n /**\n * Whether the avatar should be rounded.\n * @default true\n */\n rounded?: boolean;\n /**\n * Display an outer border around the avatar.\n */\n border?: boolean;\n /**\n * Display a badge (i.e. company logo).\n */\n badge?: ReactNode;\n /**\n * Display a status indicator.\n */\n status?: \"online\" | \"offline\";\n /**\n * Display a verified tick icon.\n *\n * @default false\n */\n verified?: boolean;\n /**\n * Display a count badge.\n */\n count?: number;\n /**\n * The initials of the user to display if no image is available.\n */\n initials?: string;\n /**\n * An icon to display if no image is available.\n */\n placeholderIcon?: FC<{ className?: string }>;\n /**\n * A placeholder to display if no image is available.\n */\n placeholder?: ReactNode;\n\n /**\n * Whether the avatar should show a focus ring when the parent group is in focus.\n * For example, when the avatar is wrapped inside a link.\n *\n * @default false\n */\n focusable?: boolean;\n}\n\nconst styles = {\n xs: { root: \"size-6\", rootWithBorder: \"p-px\", initials: \"text-xs font-semibold\", icon: \"size-4\" },\n sm: { root: \"size-8\", rootWithBorder: \"p-px\", initials: \"text-sm font-semibold\", icon: \"size-5\" },\n md: { root: \"size-10\", rootWithBorder: \"p-px\", initials: \"text-md font-semibold\", icon: \"size-6\" },\n lg: { root: \"size-12\", rootWithBorder: \"p-[1.5px]\", initials: \"text-lg font-semibold\", icon: \"size-7\" },\n xl: { root: \"size-14\", rootWithBorder: \"p-0.5\", initials: \"text-xl font-semibold\", icon: \"size-8\" },\n \"2xl\": { root: \"size-16\", rootWithBorder: \"p-0.5\", initials: \"text-display-xs font-semibold\", icon: \"size-8\" },\n};\n\nexport const Avatar = ({\n size = \"md\",\n src,\n alt,\n initials,\n placeholder,\n placeholderIcon: PlaceholderIcon,\n border,\n badge,\n status,\n verified,\n count,\n focusable = false,\n rounded = true,\n className,\n contentClassName,\n}: AvatarProps) => {\n const [isFailed, setIsFailed] = useState(false);\n\n const canShowImage = src && !isFailed;\n\n const renderMainContent = () => {\n if (canShowImage) {\n return <img data-avatar-img className=\"size-full object-cover\" src={src} alt={alt} onError={() => setIsFailed(true)} />;\n }\n\n if (initials) {\n return <span className={cx(\"text-quaternary\", styles[size].initials)}>{initials}</span>;\n }\n\n if (PlaceholderIcon) {\n return <PlaceholderIcon className={cx(\"text-fg-quaternary\", styles[size].icon)} />;\n }\n\n return placeholder || <User01 className={cx(\"text-fg-quaternary\", styles[size].icon)} />;\n };\n\n const renderBadgeContent = () => {\n if (status) {\n return <AvatarOnlineIndicator status={status} size={size} />;\n }\n\n if (verified) {\n return <VerifiedTick size={size} className={cx(\"absolute right-0 bottom-0\", size === \"xs\" && \"-right-px -bottom-px\")} />;\n }\n\n if (count) {\n return <AvatarCount count={count} />;\n }\n\n return badge;\n };\n\n return (\n <div\n data-avatar\n className={cx(\n \"relative inline-flex shrink-0 rounded-[7px]\",\n rounded && \"rounded-full\",\n // Focus styles\n focusable &&\n \"outline-none group-focus-visible:[box-shadow:0px_0px_0px_2px_var(--color-bg-primary),0px_0px_0px_4px_var(--color-focus-ring)]\",\n border && \"ring-1 ring-secondary_alt\",\n border && styles[size].rootWithBorder,\n styles[size].root,\n className,\n )}\n >\n <div\n className={cx(\n \"relative inline-flex size-full shrink-0 items-center justify-center overflow-hidden rounded-md bg-tertiary outline-[0.5px] -outline-offset-[0.5px] outline-black/16 before:inset-[0.5px]\",\n rounded && \"rounded-full\",\n canShowImage &&\n size !== \"xs\" &&\n \"before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-white/32 before:mask-[linear-gradient(to_bottom,black_0%,transparent_25%,transparent_75%,black_100%)]\",\n contentClassName,\n )}\n >\n {renderMainContent()}\n </div>\n {renderBadgeContent()}\n </div>\n );\n};\n","\"use client\";\n\nimport { useLayoutEffect, useRef, type ReactNode, type Ref } from \"react\";\nimport { Checkbox as AriaCheckbox, type CheckboxProps as AriaCheckboxProps } from \"react-aria-components\";\nimport { cx } from \"@/utils/cx\";\n\nconst CHECKBOX_TICK_DELAY_MS = 60;\nconst CHECKBOX_TICK_DRAW_MS = 100;\n\n/** Draw-on-check tick animation — remounts when checked so it replays each time. */\nfunction CheckboxAnimatedCheckMark({ pixelSize, className }: { pixelSize: number; className?: string }) {\n const pathRef = useRef<SVGPathElement>(null);\n\n useLayoutEffect(() => {\n const path = pathRef.current;\n if (!path || typeof path.getTotalLength !== \"function\") return;\n const len = path.getTotalLength();\n if (len <= 0) return;\n\n path.style.strokeDasharray = `${len}`;\n path.style.strokeDashoffset = `${len}`;\n\n if (typeof path.animate !== \"function\") {\n path.style.strokeDashoffset = \"0\";\n return;\n }\n\n const anim = path.animate([{ strokeDashoffset: len }, { strokeDashoffset: 0 }], {\n duration: CHECKBOX_TICK_DRAW_MS,\n delay: CHECKBOX_TICK_DELAY_MS,\n easing: \"cubic-bezier(0.45, 0, 0.2, 1)\",\n fill: \"forwards\",\n });\n return () => anim.cancel();\n }, []);\n\n return (\n <svg aria-hidden=\"true\" width={pixelSize} height={pixelSize} viewBox=\"0 0 14 14\" fill=\"none\" className={cx(\"block\", className)}>\n <path\n ref={pathRef}\n d=\"M2.33325 7L5.24992 9.91667L11.6666 3.5\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n );\n}\n\n/** Figma Focus rings/focus-ring — 2px surface gap + 4px brand ring (matches Button). */\nconst focusRingShadow =\n \"outline-none [box-shadow:0px_0px_0px_2px_var(--color-bg-primary),0px_0px_0px_4px_var(--color-focus-ring)]\";\n\nexport interface CheckboxBaseProps {\n size?: \"sm\" | \"md\";\n className?: string;\n isFocusVisible?: boolean;\n isSelected?: boolean;\n isDisabled?: boolean;\n isIndeterminate?: boolean;\n}\n\nexport const CheckboxBase = ({ className, isSelected, isDisabled, isIndeterminate, size = \"sm\", isFocusVisible = false }: CheckboxBaseProps) => {\n const isChecked = isSelected || isIndeterminate;\n const iconPixelSize = size === \"sm\" ? 10 : 14;\n\n return (\n <div\n className={cx(\n \"relative flex shrink-0 cursor-pointer appearance-none items-center justify-center overflow-clip border border-solid border-primary\",\n size === \"sm\" ? \"size-4 rounded-xs\" : \"size-5 rounded-sm\",\n isChecked ? \"border-transparent bg-brand-solid\" : \"bg-primary\",\n !isChecked && !isDisabled && \"group-hover:bg-primary_hover\",\n isDisabled && \"cursor-not-allowed opacity-50\",\n isDisabled && !isChecked && \"bg-tertiary\",\n isFocusVisible && !isDisabled && focusRingShadow,\n className,\n )}\n >\n {isIndeterminate && (\n <svg\n aria-hidden=\"true\"\n width={iconPixelSize}\n height={iconPixelSize}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n className=\"pointer-events-none block text-fg-white\"\n >\n <path d=\"M2.91675 7H11.0834\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n </svg>\n )}\n\n {isSelected && !isIndeterminate && (\n <CheckboxAnimatedCheckMark pixelSize={iconPixelSize} className=\"pointer-events-none text-fg-white\" />\n )}\n </div>\n );\n};\nCheckboxBase.displayName = \"CheckboxBase\";\n\ninterface CheckboxProps extends AriaCheckboxProps {\n ref?: Ref<HTMLLabelElement>;\n size?: \"sm\" | \"md\";\n label?: ReactNode;\n hint?: ReactNode;\n}\n\nexport const Checkbox = ({ label, hint, size = \"sm\", className, ...ariaCheckboxProps }: CheckboxProps) => {\n const sizes = {\n sm: {\n root: \"gap-2\",\n textWrapper: \"\",\n label: \"text-sm font-medium\",\n hint: \"text-sm\",\n },\n md: {\n root: \"gap-3\",\n textWrapper: \"gap-0.5 break-words\",\n label: \"text-md font-medium\",\n hint: \"text-md\",\n },\n };\n\n return (\n <AriaCheckbox\n {...ariaCheckboxProps}\n className={(state) =>\n cx(\n \"group relative flex items-start\",\n state.isDisabled && \"cursor-not-allowed\",\n sizes[size].root,\n typeof className === \"function\" ? className(state) : className,\n )\n }\n >\n {({ isSelected, isIndeterminate, isDisabled, isFocusVisible }) => (\n <>\n <CheckboxBase\n size={size}\n isSelected={isSelected}\n isIndeterminate={isIndeterminate}\n isDisabled={isDisabled}\n isFocusVisible={isFocusVisible}\n className={label || hint ? \"mt-0.5\" : \"\"}\n />\n {(label || hint) && (\n <div className={cx(\"inline-flex flex-col\", sizes[size].textWrapper)}>\n {label && <p className={cx(\"text-secondary select-none\", sizes[size].label)}>{label}</p>}\n {hint && (\n <span className={cx(\"text-tertiary\", sizes[size].hint)} onClick={(event) => event.stopPropagation()}>\n {hint}\n </span>\n )}\n </div>\n )}\n </>\n )}\n </AriaCheckbox>\n );\n};\nCheckbox.displayName = \"Checkbox\";\n","/* We cannot use type `unknown` instead of `any` here because it will break the type assertion `isReactComponent` function is providing. */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type React from \"react\";\n\ntype ReactComponent = React.FC<any> | React.ComponentClass<any, any>;\n\n/**\n * Checks if a given value is a function component.\n */\nexport const isFunctionComponent = (component: any): component is React.FC<any> => {\n return typeof component === \"function\";\n};\n\n/**\n * Checks if a given value is a class component.\n */\nexport const isClassComponent = (component: any): component is React.ComponentClass<any, any> => {\n return typeof component === \"function\" && component.prototype && (!!component.prototype.isReactComponent || !!component.prototype.render);\n};\n\n/**\n * Checks if a given value is a forward ref component.\n */\nexport const isForwardRefComponent = (component: any): component is React.ForwardRefExoticComponent<any> => {\n return typeof component === \"object\" && component !== null && component.$$typeof.toString() === \"Symbol(react.forward_ref)\";\n};\n\n/**\n * Checks if a given value is a valid React component.\n */\nexport const isReactComponent = (component: any): component is ReactComponent => {\n return isFunctionComponent(component) || isForwardRefComponent(component) || isClassComponent(component);\n};\n","\"use client\";\n\nimport type { FC, ReactNode } from \"react\";\nimport { createContext } from \"react\";\nimport type { SelectMobileOptions } from \"./select-mobile-sheet\";\n\nexport type SelectItemType = {\n /** Unique identifier for the item. */\n id: string | number;\n /** The primary display text. */\n label?: string;\n /** Avatar image URL. */\n avatarUrl?: string;\n /** Whether the item is disabled. */\n isDisabled?: boolean;\n /** Secondary text displayed alongside the label. */\n supportingText?: string;\n /** Leading icon component or element. */\n icon?: FC | ReactNode;\n};\n\nexport interface CommonProps {\n /** Helper text displayed below the input. */\n hint?: string;\n /** Field label displayed above the input. */\n label?: string;\n /** Tooltip text for the help icon next to the label. */\n tooltip?: string;\n /**\n * The size of the component.\n * @default \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n /** Placeholder text when no value is selected. */\n placeholder?: string;\n /** Whether to hide the required indicator from the label. */\n hideRequiredIndicator?: boolean;\n /**\n * Narrow-viewport (≤1024px) bottom-sheet options for the menu.\n * `sheet` defaults to `true` on viewports ≤1024px wide.\n */\n mobileOptions?: SelectMobileOptions;\n}\n\nexport const sizes = {\n sm: {\n root: \"py-2 pl-3 pr-2.5 gap-2 *:data-icon:size-4 *:data-icon:stroke-[2.25px]\",\n withIcon: \"\",\n text: \"text-sm\",\n textContainer: \"gap-x-1.5\",\n shortcut: \"pr-2.5\",\n },\n md: { root: \"py-2 px-3 gap-2 *:data-icon:size-5\", withIcon: \"\", text: \"text-md\", textContainer: \"gap-x-1.5\", shortcut: \"pr-2.5\" },\n lg: { root: \"py-2.5 px-3.5 gap-2 *:data-icon:size-5\", withIcon: \"\", text: \"text-md\", textContainer: \"gap-x-1.5\", shortcut: \"pr-3\" },\n};\n\n/** Shared search-field layout for multi-select and combo box mobile sheets. */\nexport const searchSizes = {\n sm: { wrapper: \"py-1\", root: \"px-3 py-2 gap-2 *:data-icon:size-4 *:data-icon:stroke-[2.25px]\", text: \"text-sm\" },\n md: { wrapper: \"py-0.5\", root: \"px-3 py-2 gap-2 *:data-icon:size-5\", text: \"text-md\" },\n lg: { wrapper: \"py-0.5\", root: \"px-3.5 py-2.5 gap-2 *:data-icon:size-5\", text: \"text-md\" },\n};\n\nexport const SelectContext = createContext<{ size: \"sm\" | \"md\" | \"lg\" }>({ size: \"md\" });\n\nexport type { SelectMobileOptions } from \"./select-mobile-sheet\";\n","\"use client\";\n\n/** Figma: Select item (11132:11643) — selected uses bg-brand-primary_alt; hover/focus use bg-primary_hover. */\n\nimport { isValidElement, useContext } from \"react\";\nimport { CheckIcon as Check } from \"@phosphor-icons/react/dist/csr/Check\";\nimport type { ListBoxItemProps as AriaListBoxItemProps } from \"react-aria-components\";\nimport { ListBoxItem as AriaListBoxItem, Text as AriaText } from \"react-aria-components\";\nimport { Avatar } from \"@/components/base/avatar/avatar\";\nimport { CheckboxBase } from \"@/components/base/checkbox/checkbox\";\nimport { cx } from \"@/utils/cx\";\nimport { isReactComponent } from \"@/utils/is-react-component\";\nimport type { SelectItemType } from \"./select-shared\";\nimport { SelectContext } from \"./select-shared\";\n\nconst sizes = {\n sm: {\n root: \"p-2 pr-2.5 gap-2 *:data-icon:size-4 *:data-icon:stroke-[2.25px]\",\n text: \"text-sm\",\n textContainer: \"gap-x-1.5\",\n check: \"size-4 stroke-[2.25px]\",\n checkbox: \"sm\" as const,\n },\n md: {\n root: \"p-2 pr-2.5 gap-2 *:data-icon:size-5\",\n text: \"text-md\",\n textContainer: \"gap-x-2\",\n check: \"size-5\",\n checkbox: \"sm\" as const,\n },\n lg: {\n root: \"p-2.5 pl-2 gap-2 *:data-icon:size-5\",\n text: \"text-md\",\n textContainer: \"gap-x-2\",\n check: \"size-5\",\n checkbox: \"md\" as const,\n },\n};\n\ninterface SelectItemProps extends Omit<AriaListBoxItemProps<SelectItemType>, \"id\">, SelectItemType {\n /** The selection indicator to be displayed on the item. */\n selectionIndicator?: \"checkmark\" | \"checkbox\" | \"none\";\n /** The alignment of the selection indicator. */\n selectionIndicatorAlign?: \"left\" | \"right\";\n}\n\nexport const SelectItem = ({\n label,\n id,\n value,\n avatarUrl,\n supportingText,\n isDisabled,\n icon: Icon,\n className,\n children,\n selectionIndicator = \"checkmark\",\n selectionIndicatorAlign = \"right\",\n ...props\n}: SelectItemProps) => {\n const { size } = useContext(SelectContext);\n\n const labelOrChildren = label || (typeof children === \"string\" ? children : \"\");\n const textValue = supportingText ? labelOrChildren + \" \" + supportingText : labelOrChildren;\n\n const isLeft = selectionIndicatorAlign === \"left\";\n\n return (\n <AriaListBoxItem\n id={id}\n value={\n value ?? {\n id,\n label: labelOrChildren,\n avatarUrl,\n supportingText,\n isDisabled,\n icon: Icon,\n }\n }\n textValue={textValue}\n isDisabled={isDisabled}\n {...props}\n className={(state) =>\n cx(\"w-full py-px outline-hidden\", size === \"sm\" ? \"px-1\" : \"px-1.5\", typeof className === \"function\" ? className(state) : className)\n }\n >\n {(state) => (\n <div\n className={cx(\n \"flex cursor-pointer items-center rounded-md outline-hidden select-none\",\n (state.isFocused || state.isHovered) &&\n !(state.isSelected && selectionIndicator !== \"checkbox\") &&\n \"bg-primary_hover\",\n state.isSelected && selectionIndicator !== \"checkbox\" && \"bg-brand-primary_alt\",\n state.isDisabled && \"cursor-not-allowed opacity-50\",\n\n // Icon styles\n \"*:data-icon:shrink-0 *:data-icon:text-fg-quaternary\",\n\n sizes[size].root,\n )}\n >\n {isLeft && selectionIndicator === \"checkbox\" && (\n <CheckboxBase size={sizes[size].checkbox} isSelected={state.isSelected} isDisabled={state.isDisabled} />\n )}\n\n {avatarUrl ? (\n <Avatar aria-hidden=\"true\" size=\"xs\" src={avatarUrl} alt={label} className={cx(size === \"sm\" && \"size-5\")} />\n ) : isReactComponent(Icon) ? (\n <Icon data-icon aria-hidden=\"true\" />\n ) : isValidElement(Icon) ? (\n Icon\n ) : null}\n\n <div className={cx(\"flex w-full min-w-0 flex-1 flex-wrap\", sizes[size].textContainer)}>\n <AriaText slot=\"label\" className={cx(\"truncate font-medium whitespace-nowrap text-primary\", sizes[size].text)}>\n {label || (typeof children === \"function\" ? children(state) : children)}\n </AriaText>\n\n {supportingText && (\n <AriaText slot=\"description\" className={cx(\"whitespace-nowrap text-tertiary\", sizes[size].text)}>\n {supportingText}\n </AriaText>\n )}\n </div>\n\n {state.isSelected && selectionIndicator === \"checkmark\" && (\n <Check aria-hidden=\"true\" className={cx(\"ml-auto text-fg-brand-primary\", sizes[size].check)} />\n )}\n\n {!isLeft && selectionIndicator === \"checkbox\" && (\n <CheckboxBase size={sizes[size].checkbox} isSelected={state.isSelected} isDisabled={state.isDisabled} className=\"ml-auto\" />\n )}\n </div>\n )}\n </AriaListBoxItem>\n );\n};\n"]}
|
package/dist/react/select.d.ts
CHANGED
|
@@ -3,8 +3,9 @@ import { RefAttributes, FC, ReactNode } from 'react';
|
|
|
3
3
|
import { SelectProps as SelectProps$1 } from 'react-aria-components';
|
|
4
4
|
import { ComboBox } from './combobox.js';
|
|
5
5
|
import { SelectItem } from './select-item.js';
|
|
6
|
-
import { S as SelectItemType, C as CommonProps } from '../select-shared-
|
|
7
|
-
export { a as SelectContext, s as sizes } from '../select-shared-
|
|
6
|
+
import { S as SelectItemType, C as CommonProps } from '../select-shared-oJEeJxeB.js';
|
|
7
|
+
export { a as SelectContext, s as sizes } from '../select-shared-oJEeJxeB.js';
|
|
8
|
+
export { S as SelectMobileOptions } from '../select-mobile-sheet-CB2ptDTJ.js';
|
|
8
9
|
|
|
9
10
|
interface SelectProps extends Omit<SelectProps$1<SelectItemType>, "children" | "items">, RefAttributes<HTMLDivElement>, CommonProps {
|
|
10
11
|
items?: SelectItemType[];
|
|
@@ -12,7 +13,7 @@ interface SelectProps extends Omit<SelectProps$1<SelectItemType>, "children" | "
|
|
|
12
13
|
icon?: FC | ReactNode;
|
|
13
14
|
children: ReactNode | ((item: SelectItemType) => ReactNode);
|
|
14
15
|
}
|
|
15
|
-
declare const Select: ({ placeholder, icon, size, children, items, label, hint, tooltip, hideRequiredIndicator, className, ...rest }: SelectProps) => react.JSX.Element;
|
|
16
|
+
declare const Select: ({ placeholder, icon, size, children, items, label, hint, tooltip, hideRequiredIndicator, mobileOptions, className, ...rest }: SelectProps) => react.JSX.Element;
|
|
16
17
|
declare const _Select: typeof Select & {
|
|
17
18
|
ComboBox: typeof ComboBox;
|
|
18
19
|
Item: typeof SelectItem;
|