@patternfly/react-templates 6.0.0-alpha.45 → 6.0.0-alpha.46
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/CHANGELOG.md +4 -0
- package/components/package.json +1 -1
- package/dist/dynamic/components/Dropdown/package.json +1 -1
- package/dist/dynamic/components/Select/package.json +1 -1
- package/dist/dynamic-modules.json +4 -0
- package/dist/esm/components/Select/CheckboxSelect.d.ts.map +1 -1
- package/dist/esm/components/Select/CheckboxSelect.js +5 -0
- package/dist/esm/components/Select/CheckboxSelect.js.map +1 -1
- package/dist/esm/components/Select/MultiTypeaheadSelect.d.ts +33 -0
- package/dist/esm/components/Select/MultiTypeaheadSelect.d.ts.map +1 -0
- package/dist/esm/components/Select/MultiTypeaheadSelect.js +186 -0
- package/dist/esm/components/Select/MultiTypeaheadSelect.js.map +1 -0
- package/dist/esm/components/Select/SimpleSelect.d.ts +2 -0
- package/dist/esm/components/Select/SimpleSelect.d.ts.map +1 -1
- package/dist/esm/components/Select/SimpleSelect.js +10 -6
- package/dist/esm/components/Select/SimpleSelect.js.map +1 -1
- package/dist/esm/components/Select/TypeaheadSelect.d.ts +12 -2
- package/dist/esm/components/Select/TypeaheadSelect.d.ts.map +1 -1
- package/dist/esm/components/Select/TypeaheadSelect.js +61 -22
- package/dist/esm/components/Select/TypeaheadSelect.js.map +1 -1
- package/dist/esm/components/Select/index.d.ts +1 -0
- package/dist/esm/components/Select/index.d.ts.map +1 -1
- package/dist/esm/components/Select/index.js +1 -0
- package/dist/esm/components/Select/index.js.map +1 -1
- package/dist/js/components/Select/CheckboxSelect.d.ts.map +1 -1
- package/dist/js/components/Select/CheckboxSelect.js +5 -0
- package/dist/js/components/Select/CheckboxSelect.js.map +1 -1
- package/dist/js/components/Select/MultiTypeaheadSelect.d.ts +33 -0
- package/dist/js/components/Select/MultiTypeaheadSelect.d.ts.map +1 -0
- package/dist/js/components/Select/MultiTypeaheadSelect.js +190 -0
- package/dist/js/components/Select/MultiTypeaheadSelect.js.map +1 -0
- package/dist/js/components/Select/SimpleSelect.d.ts +2 -0
- package/dist/js/components/Select/SimpleSelect.d.ts.map +1 -1
- package/dist/js/components/Select/SimpleSelect.js +10 -6
- package/dist/js/components/Select/SimpleSelect.js.map +1 -1
- package/dist/js/components/Select/TypeaheadSelect.d.ts +12 -2
- package/dist/js/components/Select/TypeaheadSelect.d.ts.map +1 -1
- package/dist/js/components/Select/TypeaheadSelect.js +61 -22
- package/dist/js/components/Select/TypeaheadSelect.js.map +1 -1
- package/dist/js/components/Select/index.d.ts +1 -0
- package/dist/js/components/Select/index.d.ts.map +1 -1
- package/dist/js/components/Select/index.js +1 -0
- package/dist/js/components/Select/index.js.map +1 -1
- package/dist/umd/assets/{output--NzZZ7D3.css → output-DPlyZse9.css} +3498 -3498
- package/dist/umd/react-templates.min.js +1 -1
- package/package.json +6 -6
- package/src/components/Select/CheckboxSelect.tsx +5 -0
- package/src/components/Select/MultiTypeaheadSelect.tsx +348 -0
- package/src/components/Select/SimpleSelect.tsx +13 -5
- package/src/components/Select/TypeaheadSelect.tsx +84 -25
- package/src/components/Select/__tests__/MultiTypeaheadSelect.test.tsx +414 -0
- package/src/components/Select/__tests__/__snapshots__/MultiTypeaheadSelect.test.tsx.snap +97 -0
- package/src/components/Select/examples/CheckboxSelectDemo.tsx +25 -8
- package/src/components/Select/examples/MultiTypeaheadSelectDemo.tsx +35 -0
- package/src/components/Select/examples/SelectTemplates.md +7 -1
- package/src/components/Select/examples/SimpleSelectDemo.tsx +16 -6
- package/src/components/Select/examples/TypeaheadSelectDemo.tsx +57 -13
- package/src/components/Select/index.ts +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TypeaheadSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/TypeaheadSelect.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,MAAM,EACN,YAAY,EACZ,UAAU,EAEV,UAAU,EAEV,cAAc,EACd,kBAAkB,EAClB,uBAAuB,EACvB,MAAM,EAGP,MAAM,wBAAwB,CAAC;AAChC,OAAO,SAAS,MAAM,mDAAmD,CAAC;
|
|
1
|
+
{"version":3,"file":"TypeaheadSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/TypeaheadSelect.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,MAAM,EACN,YAAY,EACZ,UAAU,EAEV,UAAU,EAEV,cAAc,EACd,kBAAkB,EAClB,uBAAuB,EACvB,MAAM,EAGP,MAAM,wBAAwB,CAAC;AAChC,OAAO,SAAS,MAAM,mDAAmD,CAAC;AA6C1E,MAAM,4BAA4B,GAAG,CAAC,MAAc,EAAE,EAAE,CAAC,yBAAyB,MAAM,GAAG,CAAC;AAC5F,MAAM,0BAA0B,GAAG,CAAC,QAAgB,EAAE,EAAE,CAAC,WAAW,QAAQ,GAAG,CAAC;AAEhF,MAAM,CAAC,MAAM,mBAAmB,GAAkD,CAAC,EAiB5D,EAAE,EAAE;;QAjBwD,EACjF,QAAQ,EACR,cAAc,EACd,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,WAAW,GAAG,kBAAkB,EAChC,yBAAyB,GAAG,0BAA0B,EACtD,qBAAqB,GAAG,4BAA4B,EACpD,WAAW,GAAG,KAAK,EACnB,mBAAmB,GAAG,KAAK,EAC3B,mBAAmB,GAAG,0BAA0B,EAChD,UAAU,EACV,WAAW,EACX,WAAW,OAEU,EADlB,KAAK,cAhByE,yQAiBlF,CADS;IAER,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,MAAM,CAAC,MAAA,MAAA,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,0CAAE,OAAO,mCAAI,EAAE,CAAC,CAAC,CAAC;IACtH,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAChD,MAAM,CAAC,MAAA,MAAA,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,0CAAE,OAAO,mCAAI,EAAE,CAAC,CAC9D,CAAC;IACF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,EAAE,CAAC,CAAC;IACjE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA0B,cAAc,CAAC,CAAC;IAClG,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACpF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC5E,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,EAAoB,CAAC;IAEtD,MAAM,UAAU,GAAG,YAAY,CAAC;IAEhC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,gBAAgB,GAA4B,cAAc,CAAC;QAE/D,kEAAkE;QAClE,IAAI,WAAW,EAAE,CAAC;YAChB,gBAAgB,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE,CAClD,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,CACzE,CAAC;YAEF,IACE,WAAW;gBACX,WAAW;gBACX,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC,WAAW,EAAE,CAAC,EAC1F,CAAC;gBACD,MAAM,YAAY,GAAG;oBACnB,OAAO,EAAE,OAAO,mBAAmB,KAAK,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAC,WAAW,CAAC;oBACzG,KAAK,EAAE,WAAW;iBACnB,CAAC;gBACF,gBAAgB,GAAG,mBAAmB;oBACpC,CAAC,CAAC,CAAC,YAAY,EAAE,GAAG,gBAAgB,CAAC;oBACrC,CAAC,CAAC,CAAC,GAAG,gBAAgB,EAAE,YAAY,CAAC,CAAC;YAC1C,CAAC;YAED,wEAAwE;YACxE,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;gBAC7B,gBAAgB,GAAG;oBACjB;wBACE,cAAc,EAAE,IAAI;wBACpB,OAAO,EACL,OAAO,qBAAqB,KAAK,QAAQ,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,qBAAqB,CAAC,WAAW,CAAC;wBACxG,KAAK,EAAE,UAAU;qBAClB;iBACF,CAAC;YACJ,CAAC;YAED,4EAA4E;YAC5E,QAAQ,EAAE,CAAC;QACb,CAAC;QAED,kEAAkE;QAClE,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;YAC7B,gBAAgB,GAAG;gBACjB;oBACE,cAAc,EAAE,IAAI;oBACpB,OAAO,EAAE,yBAAyB;oBAClC,KAAK,EAAE,UAAU;iBAClB;aACF,CAAC;QACJ,CAAC;QAED,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACrC,CAAC,EAAE;QACD,WAAW;QACX,cAAc;QACd,qBAAqB;QACrB,WAAW;QACX,mBAAmB;QACnB,mBAAmB;QACnB,yBAAyB;KAC1B,CAAC,CAAC;IAEH,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,0HAA0H;QAC1H,MAAM,cAAc,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;QAC9D,IAAI,UAAU,KAAK,QAAQ,IAAI,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,KAAK,MAAK,QAAQ,EAAE,CAAC;YAClE,aAAa,CAAC,MAAM,CAAC,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,mCAAI,EAAE,CAAC,CAAC,CAAC;QACvD,CAAC;QACD,kCAAkC;QAClC,uDAAuD;IACzD,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,MAAM,uBAAuB,GAAG,CAAC,SAAiB,EAAE,EAAE;QACpD,mBAAmB,CAAC,SAAS,CAAC,CAAC;QAC/B,MAAM,WAAW,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;QAC7C,eAAe,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IAC7C,CAAC,CAAC;IAEF,MAAM,yBAAyB,GAAG,GAAG,EAAE;QACrC,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,eAAe,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,QAAQ,IAAI,QAAQ,CAAC,IAAI,CAAC,CAAC;YAC3B,SAAS,CAAC,IAAI,CAAC,CAAC;QAClB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC5B,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,yBAAyB,EAAE,CAAC;QAC5B,MAAM,MAAM,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;QAChE,IAAI,MAAM,EAAE,CAAC;YACX,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;QACxC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,CAAC,MAAM,EAAE,CAAC;YACZ,QAAQ,EAAE,CAAC;QACb,CAAC;aAAM,IAAI,CAAC,UAAU,EAAE,CAAC;YACvB,SAAS,EAAE,CAAC;QACd,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CACnB,MAAiG,EACjG,MAA6B,EAC7B,EAAE;QACF,QAAQ,IAAI,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;QAE3C,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;QACtC,cAAc,CAAC,EAAE,CAAC,CAAC;QACnB,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;QAElC,SAAS,EAAE,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,MAAyD,EAAE,KAAkC,EAAE,EAAE;QAClH,IAAI,KAAK,IAAI,KAAK,KAAK,UAAU,EAAE,CAAC;YAClC,MAAM,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC;YAC9E,YAAY,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,MAAyC,EAAE,KAAa,EAAE,EAAE;QACrF,aAAa,CAAC,KAAK,CAAC,CAAC;QACrB,aAAa,IAAI,aAAa,CAAC,KAAK,CAAC,CAAC;QACtC,cAAc,CAAC,KAAK,CAAC,CAAC;QAEtB,yBAAyB,EAAE,CAAC;IAC9B,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,CAAC,GAAW,EAAE,EAAE;QAC1C,IAAI,YAAY,GAAG,CAAC,CAAC;QAErB,QAAQ,EAAE,CAAC;QAEX,IAAI,aAAa,CAAC,KAAK,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC;YACvD,OAAO;QACT,CAAC;QAED,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;YACtB,iGAAiG;YACjG,IAAI,gBAAgB,KAAK,IAAI,IAAI,gBAAgB,KAAK,CAAC,EAAE,CAAC;gBACxD,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;YAC1C,CAAC;iBAAM,CAAC;gBACN,YAAY,GAAG,gBAAgB,GAAG,CAAC,CAAC;YACtC,CAAC;YAED,wBAAwB;YACxB,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC,UAAU,EAAE,CAAC;gBAC9C,YAAY,EAAE,CAAC;gBACf,IAAI,YAAY,KAAK,CAAC,CAAC,EAAE,CAAC;oBACxB,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;gBAC1C,CAAC;YACH,CAAC;QACH,CAAC;QAED,IAAI,GAAG,KAAK,WAAW,EAAE,CAAC;YACxB,iGAAiG;YACjG,IAAI,gBAAgB,KAAK,IAAI,IAAI,gBAAgB,KAAK,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAC/E,YAAY,GAAG,CAAC,CAAC;YACnB,CAAC;iBAAM,CAAC;gBACN,YAAY,GAAG,gBAAgB,GAAG,CAAC,CAAC;YACtC,CAAC;YAED,wBAAwB;YACxB,OAAO,aAAa,CAAC,YAAY,CAAC,CAAC,UAAU,EAAE,CAAC;gBAC9C,YAAY,EAAE,CAAC;gBACf,IAAI,YAAY,KAAK,aAAa,CAAC,MAAM,EAAE,CAAC;oBAC1C,YAAY,GAAG,CAAC,CAAC;gBACnB,CAAC;YACH,CAAC;QACH,CAAC;QAED,uBAAuB,CAAC,YAAY,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,KAA4C,EAAE,EAAE;QACtE,MAAM,WAAW,GAAG,gBAAgB,KAAK,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAEvF,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,IAAI,MAAM,IAAI,WAAW,IAAI,WAAW,CAAC,KAAK,KAAK,UAAU,IAAI,CAAC,WAAW,CAAC,cAAc,EAAE,CAAC;oBAC7F,YAAY,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;gBACnC,CAAC;gBAED,QAAQ,EAAE,CAAC;gBAEX,MAAM;YACR,KAAK,SAAS,CAAC;YACf,KAAK,WAAW;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,mBAAmB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBAC/B,MAAM;QACV,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;;QACzB,QAAQ,IAAI,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;QAC9B,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;QACnB,MAAA,YAAY,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;;QAC9B,WAAW,CAAC,EAAE,CAAC,CAAC;QAChB,aAAa,CAAC,EAAE,CAAC,CAAC;QAClB,aAAa,IAAI,aAAa,CAAC,EAAE,CAAC,CAAC;QACnC,cAAc,CAAC,EAAE,CAAC,CAAC;QACnB,yBAAyB,EAAE,CAAC;QAC5B,MAAA,YAAY,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QAC9B,gBAAgB,IAAI,gBAAgB,EAAE,CAAC;IACzC,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,SAAuC,EAAE,EAAE,CAAC,CAC1D,oBAAC,UAAU,kBACT,GAAG,EAAE,SAAS,EACd,OAAO,EAAC,WAAW,gBACR,uBAAuB,EAClC,OAAO,EAAE,aAAa,EACtB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,UAAU,EACtB,WAAW,QACX,KAAK,EACH;YACE,KAAK,EAAE,WAAW;SACI,IAEtB,WAAW;QAEf,oBAAC,cAAc,IAAC,OAAO;YACrB,oBAAC,kBAAkB,kBACjB,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,iBAAiB,EAC3B,SAAS,EAAE,cAAc,EACzB,YAAY,EAAC,KAAK,EAClB,QAAQ,EAAE,YAAY,EACtB,WAAW,EAAE,WAAW,IACpB,CAAC,YAAY,IAAI,EAAE,uBAAuB,EAAE,YAAY,EAAE,CAAC,IAC/D,IAAI,EAAC,UAAU,EACf,UAAU,EAAE,MAAM,mBACJ,0BAA0B,IACxC;YAEF,oBAAC,uBAAuB,oBAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;gBAC9E,oBAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,OAAO,EAAE,kBAAkB,gBAChB,mBAAmB,EAC9B,IAAI,EAAE,oBAAC,SAAS,0BAAe,GAC/B,CACsB,CACX,CACN,CACd,CAAC;IAEF,OAAO,CACL,oBAAC,MAAM,kBACL,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,SAAS,EACnB,YAAY,EAAE,CAAC,MAAM,EAAE,EAAE;YACvB,CAAC,MAAM,IAAI,SAAS,EAAE,CAAC;QACzB,CAAC,EACD,MAAM,EAAE,MAAM,EACd,0BAA0B,EAAE,KAAK,EACjC,GAAG,EAAE,QAAQ,IACT,KAAK;QAET,oBAAC,UAAU,QACR,aAAa,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACnC,MAAM,EAAE,OAAO,EAAE,KAAK,KAAe,MAAM,EAAhB,KAAK,UAAK,MAAM,EAArC,oBAA4B,CAAS,CAAC;YAE5C,OAAO,CACL,oBAAC,YAAY,kBAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,gBAAgB,KAAK,KAAK,IAAM,KAAK,GACrF,OAAO,CACK,CAChB,CAAC;QACJ,CAAC,CAAC,CACS,CACN,CACV,CAAC;AACJ,CAAC,CAAC;AACF,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAExD,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAA2B,EAAE,GAAmB,EAAE,EAAE,CAAC,CACpG,oBAAC,mBAAmB,oBAAK,KAAK,IAAE,QAAQ,EAAE,GAAG,IAAI,CAClD,CAAC,CAAC;AAEH,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Select/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/CheckboxSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,eAAe,EAIf,iBAAiB,EACjB,WAAW,EACZ,MAAM,wBAAwB,CAAC;AAEhC,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC9E,oCAAoC;IACpC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;IACtE,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACxC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wFAAwF;IACxF,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;
|
|
1
|
+
{"version":3,"file":"CheckboxSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/CheckboxSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,eAAe,EAIf,iBAAiB,EACjB,WAAW,EACZ,MAAM,wBAAwB,CAAC;AAEhC,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC9E,oCAAoC;IACpC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;IACtE,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,CAAC,EAAE,oBAAoB,EAAE,CAAC;IACxC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wFAAwF;IACxF,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AAyFD,eAAO,MAAM,cAAc,iFAEzB,CAAC"}
|
|
@@ -8,6 +8,11 @@ const CheckboxSelectBase = (_a) => {
|
|
|
8
8
|
var { innerRef, initialOptions, isDisabled, onSelect: passedOnSelect, onToggle, toggleContent, toggleWidth = '200px', toggleProps } = _a, props = tslib_1.__rest(_a, ["innerRef", "initialOptions", "isDisabled", "onSelect", "onToggle", "toggleContent", "toggleWidth", "toggleProps"]);
|
|
9
9
|
const [isOpen, setIsOpen] = react_1.default.useState(false);
|
|
10
10
|
const [selected, setSelected] = react_1.default.useState([]);
|
|
11
|
+
react_1.default.useEffect(() => {
|
|
12
|
+
var _a;
|
|
13
|
+
const selectedOptions = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.filter((option) => option.selected);
|
|
14
|
+
setSelected((_a = selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.map((selectedOption) => String(selectedOption.value))) !== null && _a !== void 0 ? _a : []);
|
|
15
|
+
}, [initialOptions]);
|
|
11
16
|
const checkboxSelectOptions = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.map((option) => {
|
|
12
17
|
const { content, value } = option, props = tslib_1.__rest(option, ["content", "value"]);
|
|
13
18
|
const isSelected = selected.includes(`${value}`);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/CheckboxSelect.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CheckboxSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/CheckboxSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SelectOptionProps, MenuToggleProps, SelectProps } from '@patternfly/react-core';
|
|
3
|
+
export interface MultiTypeaheadSelectOption extends Omit<SelectOptionProps, 'content'> {
|
|
4
|
+
/** Content of the select option. */
|
|
5
|
+
content: string | number;
|
|
6
|
+
/** Value of the select option. */
|
|
7
|
+
value: string | number;
|
|
8
|
+
}
|
|
9
|
+
export interface MultiTypeaheadSelectProps extends Omit<SelectProps, 'toggle' | 'onSelect'> {
|
|
10
|
+
/** @hide Forwarded ref */
|
|
11
|
+
innerRef?: React.Ref<any>;
|
|
12
|
+
/** Initial options of the select. */
|
|
13
|
+
initialOptions: MultiTypeaheadSelectOption[];
|
|
14
|
+
/** Callback triggered on selection. */
|
|
15
|
+
onSelectionChange?: (_event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<HTMLInputElement>, selections: (string | number)[]) => void;
|
|
16
|
+
/** Callback triggered when the select opens or closes. */
|
|
17
|
+
onToggle?: (nextIsOpen: boolean) => void;
|
|
18
|
+
/** Callback triggered when the text in the input field changes. */
|
|
19
|
+
onInputChange?: (newValue: string) => void;
|
|
20
|
+
/** Placeholder text for the select input. */
|
|
21
|
+
placeholder?: string;
|
|
22
|
+
/** Message to display when no options match the filter. */
|
|
23
|
+
noOptionsFoundMessage?: string | ((filter: string) => string);
|
|
24
|
+
/** Flag indicating the select should be disabled. */
|
|
25
|
+
isDisabled?: boolean;
|
|
26
|
+
/** Width of the toggle. */
|
|
27
|
+
toggleWidth?: string;
|
|
28
|
+
/** Additional props passed to the toggle. */
|
|
29
|
+
toggleProps?: MenuToggleProps;
|
|
30
|
+
}
|
|
31
|
+
export declare const MultiTypeaheadSelectBase: React.FunctionComponent<MultiTypeaheadSelectProps>;
|
|
32
|
+
export declare const MultiTypeaheadSelect: React.ForwardRefExoticComponent<MultiTypeaheadSelectProps & React.RefAttributes<any>>;
|
|
33
|
+
//# sourceMappingURL=MultiTypeaheadSelect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultiTypeaheadSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/MultiTypeaheadSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,iBAAiB,EAOjB,eAAe,EACf,WAAW,EAGZ,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IACpF,oCAAoC;IACpC,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,yBAA0B,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,UAAU,CAAC;IACzF,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,EAAE,0BAA0B,EAAE,CAAC;IAC7C,uCAAuC;IACvC,iBAAiB,CAAC,EAAE,CAClB,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EACrF,UAAU,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAC5B,IAAI,CAAC;IACV,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mEAAmE;IACnE,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,qBAAqB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IAC9D,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,iBAAiB,CAAC,yBAAyB,CA+RvF,CAAC;AAIF,eAAO,MAAM,oBAAoB,uFAE/B,CAAC"}
|
|
@@ -0,0 +1,190 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.MultiTypeaheadSelect = exports.MultiTypeaheadSelectBase = void 0;
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
|
+
const react_1 = tslib_1.__importDefault(require("react"));
|
|
6
|
+
const react_core_1 = require("@patternfly/react-core");
|
|
7
|
+
const times_icon_1 = tslib_1.__importDefault(require('@patternfly/react-icons/dist/js/icons/times-icon'));
|
|
8
|
+
const MultiTypeaheadSelectBase = (_a) => {
|
|
9
|
+
var _b;
|
|
10
|
+
var { innerRef, initialOptions, onSelectionChange, onToggle, onInputChange, placeholder = 'Select an option', noOptionsFoundMessage = (filter) => `No results found for "${filter}"`, isDisabled, toggleWidth, toggleProps } = _a, props = tslib_1.__rest(_a, ["innerRef", "initialOptions", "onSelectionChange", "onToggle", "onInputChange", "placeholder", "noOptionsFoundMessage", "isDisabled", "toggleWidth", "toggleProps"]);
|
|
11
|
+
const [isOpen, setIsOpen] = react_1.default.useState(false);
|
|
12
|
+
const [selected, setSelected] = react_1.default.useState(((_b = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.filter((o) => o.selected)) !== null && _b !== void 0 ? _b : []).map((o) => o.value));
|
|
13
|
+
const [inputValue, setInputValue] = react_1.default.useState();
|
|
14
|
+
const [selectOptions, setSelectOptions] = react_1.default.useState(initialOptions);
|
|
15
|
+
const [focusedItemIndex, setFocusedItemIndex] = react_1.default.useState(null);
|
|
16
|
+
const [activeItemId, setActiveItemId] = react_1.default.useState(null);
|
|
17
|
+
const textInputRef = react_1.default.useRef();
|
|
18
|
+
const NO_RESULTS = 'no results';
|
|
19
|
+
const openMenu = () => {
|
|
20
|
+
onToggle && onToggle(true);
|
|
21
|
+
setIsOpen(true);
|
|
22
|
+
};
|
|
23
|
+
react_1.default.useEffect(() => {
|
|
24
|
+
let newSelectOptions = initialOptions;
|
|
25
|
+
// Filter menu items based on the text input value when one exists
|
|
26
|
+
if (inputValue) {
|
|
27
|
+
newSelectOptions = initialOptions.filter((option) => String(option.content).toLowerCase().includes(inputValue.toLowerCase()));
|
|
28
|
+
// When no options are found after filtering, display 'No results found'
|
|
29
|
+
if (!newSelectOptions.length) {
|
|
30
|
+
newSelectOptions = [
|
|
31
|
+
{
|
|
32
|
+
isAriaDisabled: true,
|
|
33
|
+
content: typeof noOptionsFoundMessage === 'string' ? noOptionsFoundMessage : noOptionsFoundMessage(inputValue),
|
|
34
|
+
value: NO_RESULTS
|
|
35
|
+
}
|
|
36
|
+
];
|
|
37
|
+
}
|
|
38
|
+
// Open the menu when the input value changes and the new value is not empty
|
|
39
|
+
openMenu();
|
|
40
|
+
}
|
|
41
|
+
setSelectOptions(newSelectOptions);
|
|
42
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
43
|
+
}, [inputValue, initialOptions]);
|
|
44
|
+
react_1.default.useEffect(() => { var _a; return setSelected(((_a = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.filter((o) => o.selected)) !== null && _a !== void 0 ? _a : []).map((o) => o.value)); }, [initialOptions]);
|
|
45
|
+
const setActiveAndFocusedItem = (itemIndex) => {
|
|
46
|
+
setFocusedItemIndex(itemIndex);
|
|
47
|
+
const focusedItem = selectOptions[itemIndex];
|
|
48
|
+
setActiveItemId(focusedItem.value);
|
|
49
|
+
};
|
|
50
|
+
const resetActiveAndFocusedItem = () => {
|
|
51
|
+
setFocusedItemIndex(null);
|
|
52
|
+
setActiveItemId(null);
|
|
53
|
+
};
|
|
54
|
+
const closeMenu = () => {
|
|
55
|
+
onToggle && onToggle(false);
|
|
56
|
+
setIsOpen(false);
|
|
57
|
+
resetActiveAndFocusedItem();
|
|
58
|
+
setInputValue('');
|
|
59
|
+
};
|
|
60
|
+
const onInputClick = () => {
|
|
61
|
+
if (!isOpen) {
|
|
62
|
+
openMenu();
|
|
63
|
+
}
|
|
64
|
+
else if (!inputValue) {
|
|
65
|
+
closeMenu();
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
const selectOption = (_event, option) => {
|
|
69
|
+
const selections = selected.includes(option) ? selected.filter((o) => option !== o) : [...selected, option];
|
|
70
|
+
onSelectionChange && onSelectionChange(_event, selections);
|
|
71
|
+
setSelected(selections);
|
|
72
|
+
};
|
|
73
|
+
const clearOption = (_event, option) => {
|
|
74
|
+
const selections = selected.filter((o) => option !== o);
|
|
75
|
+
onSelectionChange && onSelectionChange(_event, selections);
|
|
76
|
+
setSelected(selections);
|
|
77
|
+
};
|
|
78
|
+
const _onSelect = (_event, value) => {
|
|
79
|
+
if (value && value !== NO_RESULTS) {
|
|
80
|
+
selectOption(_event, value);
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
const onTextInputChange = (_event, value) => {
|
|
84
|
+
setInputValue(value);
|
|
85
|
+
onInputChange && onInputChange(value);
|
|
86
|
+
resetActiveAndFocusedItem();
|
|
87
|
+
};
|
|
88
|
+
const handleMenuArrowKeys = (key) => {
|
|
89
|
+
let indexToFocus = 0;
|
|
90
|
+
if (!isOpen) {
|
|
91
|
+
openMenu();
|
|
92
|
+
}
|
|
93
|
+
if (selectOptions.every((option) => option.isDisabled)) {
|
|
94
|
+
return;
|
|
95
|
+
}
|
|
96
|
+
if (key === 'ArrowUp') {
|
|
97
|
+
// When no index is set or at the first index, focus to the last, otherwise decrement focus index
|
|
98
|
+
if (focusedItemIndex === null || focusedItemIndex === 0) {
|
|
99
|
+
indexToFocus = selectOptions.length - 1;
|
|
100
|
+
}
|
|
101
|
+
else {
|
|
102
|
+
indexToFocus = focusedItemIndex - 1;
|
|
103
|
+
}
|
|
104
|
+
// Skip disabled options
|
|
105
|
+
while (selectOptions[indexToFocus].isDisabled) {
|
|
106
|
+
indexToFocus--;
|
|
107
|
+
if (indexToFocus === -1) {
|
|
108
|
+
indexToFocus = selectOptions.length - 1;
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
if (key === 'ArrowDown') {
|
|
113
|
+
// When no index is set or at the last index, focus to the first, otherwise increment focus index
|
|
114
|
+
if (focusedItemIndex === null || focusedItemIndex === selectOptions.length - 1) {
|
|
115
|
+
indexToFocus = 0;
|
|
116
|
+
}
|
|
117
|
+
else {
|
|
118
|
+
indexToFocus = focusedItemIndex + 1;
|
|
119
|
+
}
|
|
120
|
+
// Skip disabled options
|
|
121
|
+
while (selectOptions[indexToFocus].isDisabled) {
|
|
122
|
+
indexToFocus++;
|
|
123
|
+
if (indexToFocus === selectOptions.length) {
|
|
124
|
+
indexToFocus = 0;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
setActiveAndFocusedItem(indexToFocus);
|
|
129
|
+
};
|
|
130
|
+
const onInputKeyDown = (event) => {
|
|
131
|
+
const focusedItem = focusedItemIndex !== null ? selectOptions[focusedItemIndex] : null;
|
|
132
|
+
switch (event.key) {
|
|
133
|
+
case 'Enter':
|
|
134
|
+
if (isOpen && focusedItem && focusedItem.value !== NO_RESULTS && !focusedItem.isAriaDisabled) {
|
|
135
|
+
selectOption(event, focusedItem === null || focusedItem === void 0 ? void 0 : focusedItem.value);
|
|
136
|
+
}
|
|
137
|
+
if (!isOpen) {
|
|
138
|
+
onToggle && onToggle(true);
|
|
139
|
+
setIsOpen(true);
|
|
140
|
+
}
|
|
141
|
+
break;
|
|
142
|
+
case 'ArrowUp':
|
|
143
|
+
case 'ArrowDown':
|
|
144
|
+
event.preventDefault();
|
|
145
|
+
handleMenuArrowKeys(event.key);
|
|
146
|
+
break;
|
|
147
|
+
}
|
|
148
|
+
};
|
|
149
|
+
const onToggleClick = () => {
|
|
150
|
+
var _a;
|
|
151
|
+
onToggle && onToggle(!isOpen);
|
|
152
|
+
setIsOpen(!isOpen);
|
|
153
|
+
(_a = textInputRef === null || textInputRef === void 0 ? void 0 : textInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
154
|
+
};
|
|
155
|
+
const onClearButtonClick = (ev) => {
|
|
156
|
+
var _a;
|
|
157
|
+
setSelected([]);
|
|
158
|
+
onInputChange && onInputChange('');
|
|
159
|
+
resetActiveAndFocusedItem();
|
|
160
|
+
(_a = textInputRef === null || textInputRef === void 0 ? void 0 : textInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
161
|
+
onSelectionChange && onSelectionChange(ev, []);
|
|
162
|
+
};
|
|
163
|
+
const toggle = (toggleRef) => (react_1.default.createElement(react_core_1.MenuToggle, Object.assign({ ref: toggleRef, variant: "typeahead", "aria-label": "Multi select Typeahead menu toggle", onClick: onToggleClick, isExpanded: isOpen, isDisabled: isDisabled, isFullWidth: true, style: {
|
|
164
|
+
width: toggleWidth
|
|
165
|
+
} }, toggleProps),
|
|
166
|
+
react_1.default.createElement(react_core_1.TextInputGroup, { isPlain: true },
|
|
167
|
+
react_1.default.createElement(react_core_1.TextInputGroupMain, Object.assign({ value: inputValue, onClick: onInputClick, onChange: onTextInputChange, onKeyDown: onInputKeyDown, autoComplete: "off", innerRef: textInputRef, placeholder: placeholder }, (activeItemId && { 'aria-activedescendant': activeItemId }), { role: "combobox", isExpanded: isOpen, "aria-controls": "select-typeahead-listbox" }),
|
|
168
|
+
react_1.default.createElement(react_core_1.LabelGroup, { "aria-label": "Current selections" }, selected.map((selection, index) => {
|
|
169
|
+
var _a;
|
|
170
|
+
return (react_1.default.createElement(react_core_1.Label, { key: index, "datatest-id": `${selection}-chip`, onClick: (ev) => {
|
|
171
|
+
ev.stopPropagation();
|
|
172
|
+
clearOption(ev, selection);
|
|
173
|
+
} }, (_a = initialOptions.find((o) => o.value === selection)) === null || _a === void 0 ? void 0 : _a.content));
|
|
174
|
+
}))),
|
|
175
|
+
react_1.default.createElement(react_core_1.TextInputGroupUtilities, Object.assign({}, (selected.length === 0 ? { style: { display: 'none' } } : {})),
|
|
176
|
+
react_1.default.createElement(react_core_1.Button, { variant: "plain", onClick: onClearButtonClick, "aria-label": "Clear input value" },
|
|
177
|
+
react_1.default.createElement(times_icon_1.default, { "aria-hidden": true }))))));
|
|
178
|
+
return (react_1.default.createElement(react_core_1.Select, Object.assign({ isOpen: isOpen, selected: selected, onSelect: _onSelect, onOpenChange: (isOpen) => {
|
|
179
|
+
!isOpen && closeMenu();
|
|
180
|
+
}, toggle: toggle, shouldFocusFirstItemOnOpen: false, ref: innerRef }, props),
|
|
181
|
+
react_1.default.createElement(react_core_1.SelectList, null, selectOptions.map((option, index) => {
|
|
182
|
+
const { content, value } = option, props = tslib_1.__rest(option, ["content", "value"]);
|
|
183
|
+
return (react_1.default.createElement(react_core_1.SelectOption, Object.assign({ key: value, value: value, isFocused: focusedItemIndex === index }, props), content));
|
|
184
|
+
}))));
|
|
185
|
+
};
|
|
186
|
+
exports.MultiTypeaheadSelectBase = MultiTypeaheadSelectBase;
|
|
187
|
+
exports.MultiTypeaheadSelectBase.displayName = 'MultiTypeaheadSelectBase';
|
|
188
|
+
exports.MultiTypeaheadSelect = react_1.default.forwardRef((props, ref) => (react_1.default.createElement(exports.MultiTypeaheadSelectBase, Object.assign({}, props, { innerRef: ref }))));
|
|
189
|
+
exports.MultiTypeaheadSelect.displayName = 'MultiTypeaheadSelect';
|
|
190
|
+
//# sourceMappingURL=MultiTypeaheadSelect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MultiTypeaheadSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/MultiTypeaheadSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -20,6 +20,8 @@ export interface SimpleSelectProps extends Omit<SelectProps, 'toggle'> {
|
|
|
20
20
|
isDisabled?: boolean;
|
|
21
21
|
/** Content of the toggle. Defaults to the selected option. */
|
|
22
22
|
toggleContent?: React.ReactNode;
|
|
23
|
+
/** Placeholder text for the select input. */
|
|
24
|
+
placeholder?: string;
|
|
23
25
|
/** Width of the toggle. */
|
|
24
26
|
toggleWidth?: string;
|
|
25
27
|
/** Additional props passed to the toggle. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/SimpleSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,iBAAiB,EACjB,WAAW,EACZ,MAAM,mDAAmD,CAAC;AAC3D,OAAO,EAAiC,eAAe,EAAE,MAAM,uDAAuD,CAAC;AAEvH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC5E,oCAAoC;IACpC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;IACpE,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACtC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC/F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8DAA8D;IAC9D,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;
|
|
1
|
+
{"version":3,"file":"SimpleSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/SimpleSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,iBAAiB,EACjB,WAAW,EACZ,MAAM,mDAAmD,CAAC;AAC3D,OAAO,EAAiC,eAAe,EAAE,MAAM,uDAAuD,CAAC;AAEvH,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC5E,oCAAoC;IACpC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;IACpE,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACtC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC/F,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8DAA8D;IAC9D,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AAgFD,eAAO,MAAM,YAAY,+EAEvB,CAAC"}
|
|
@@ -6,12 +6,16 @@ const react_1 = tslib_1.__importDefault(require("react"));
|
|
|
6
6
|
const Select_1 = require('@patternfly/react-core/dist/js/components/Select');
|
|
7
7
|
const MenuToggle_1 = require('@patternfly/react-core/dist/js/components/MenuToggle');
|
|
8
8
|
const SimpleSelectBase = (_a) => {
|
|
9
|
-
var { innerRef, initialOptions, isDisabled, onSelect, onToggle, toggleContent, toggleWidth = '200px', toggleProps } = _a, props = tslib_1.__rest(_a, ["innerRef", "initialOptions", "isDisabled", "onSelect", "onToggle", "toggleContent", "toggleWidth", "toggleProps"]);
|
|
9
|
+
var { innerRef, initialOptions, isDisabled, onSelect, onToggle, toggleContent, toggleWidth = '200px', toggleProps, placeholder = 'Select a value' } = _a, props = tslib_1.__rest(_a, ["innerRef", "initialOptions", "isDisabled", "onSelect", "onToggle", "toggleContent", "toggleWidth", "toggleProps", "placeholder"]);
|
|
10
10
|
const [isOpen, setIsOpen] = react_1.default.useState(false);
|
|
11
|
-
const [selected, setSelected] = react_1.default.useState(
|
|
11
|
+
const [selected, setSelected] = react_1.default.useState();
|
|
12
|
+
react_1.default.useEffect(() => {
|
|
13
|
+
const selectedOption = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.find((option) => option.selected);
|
|
14
|
+
setSelected(selectedOption);
|
|
15
|
+
}, [initialOptions]);
|
|
12
16
|
const simpleSelectOptions = initialOptions === null || initialOptions === void 0 ? void 0 : initialOptions.map((option) => {
|
|
13
17
|
const { content, value } = option, props = tslib_1.__rest(option, ["content", "value"]);
|
|
14
|
-
const isSelected = selected.
|
|
18
|
+
const isSelected = (selected === null || selected === void 0 ? void 0 : selected.value) === value;
|
|
15
19
|
return (react_1.default.createElement(Select_1.SelectOption, Object.assign({ value: value, key: value, isSelected: isSelected }, props), content));
|
|
16
20
|
});
|
|
17
21
|
const onToggleClick = () => {
|
|
@@ -20,13 +24,13 @@ const SimpleSelectBase = (_a) => {
|
|
|
20
24
|
};
|
|
21
25
|
const _onSelect = (_event, value) => {
|
|
22
26
|
onSelect && onSelect(_event, value);
|
|
23
|
-
setSelected(value);
|
|
24
|
-
onToggle && onToggle(
|
|
27
|
+
setSelected(initialOptions.find((o) => o.value === value));
|
|
28
|
+
onToggle && onToggle(true);
|
|
25
29
|
setIsOpen(false);
|
|
26
30
|
};
|
|
27
31
|
const toggle = (toggleRef) => (react_1.default.createElement(MenuToggle_1.MenuToggle, Object.assign({ ref: toggleRef, onClick: onToggleClick, isExpanded: isOpen, isDisabled: isDisabled, style: {
|
|
28
32
|
width: toggleWidth
|
|
29
|
-
} }, toggleProps), toggleContent ? toggleContent : selected));
|
|
33
|
+
} }, toggleProps), toggleContent ? toggleContent : (selected === null || selected === void 0 ? void 0 : selected.content) || placeholder));
|
|
30
34
|
return (react_1.default.createElement(Select_1.Select, Object.assign({ isOpen: isOpen, selected: selected, onSelect: _onSelect, onOpenChange: (isOpen) => {
|
|
31
35
|
onToggle && onToggle(isOpen);
|
|
32
36
|
setIsOpen(isOpen);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SimpleSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/SimpleSelect.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;;;
|
|
1
|
+
{"version":3,"file":"SimpleSelect.js","sourceRoot":"","sources":["../../../../src/components/Select/SimpleSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -6,19 +6,29 @@ export interface TypeaheadSelectOption extends Omit<SelectOptionProps, 'content'
|
|
|
6
6
|
/** Value of the select option. */
|
|
7
7
|
value: string | number;
|
|
8
8
|
}
|
|
9
|
-
export interface TypeaheadSelectProps extends Omit<SelectProps, 'toggle'> {
|
|
9
|
+
export interface TypeaheadSelectProps extends Omit<SelectProps, 'toggle' | 'onSelect'> {
|
|
10
10
|
/** @hide Forwarded ref */
|
|
11
11
|
innerRef?: React.Ref<any>;
|
|
12
12
|
/** Initial options of the select. */
|
|
13
13
|
initialOptions: TypeaheadSelectOption[];
|
|
14
14
|
/** Callback triggered on selection. */
|
|
15
|
-
onSelect?: (_event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<HTMLInputElement
|
|
15
|
+
onSelect?: (_event: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<HTMLInputElement> | undefined, selection: string | number) => void;
|
|
16
16
|
/** Callback triggered when the select opens or closes. */
|
|
17
17
|
onToggle?: (nextIsOpen: boolean) => void;
|
|
18
18
|
/** Callback triggered when the text in the input field changes. */
|
|
19
19
|
onInputChange?: (newValue: string) => void;
|
|
20
|
+
/** Callback triggered when the clear button is selected */
|
|
21
|
+
onClearSelection?: () => void;
|
|
20
22
|
/** Placeholder text for the select input. */
|
|
21
23
|
placeholder?: string;
|
|
24
|
+
/** Flag to indicate if the typeahead select allows new items */
|
|
25
|
+
isCreatable?: boolean;
|
|
26
|
+
/** Flag to indicate if create option should be at top of typeahead */
|
|
27
|
+
isCreateOptionOnTop?: boolean;
|
|
28
|
+
/** Message to display to create a new option */
|
|
29
|
+
createOptionMessage?: string | ((newValue: string) => string);
|
|
30
|
+
/** Message to display when no options are available. */
|
|
31
|
+
noOptionsAvailableMessage?: string;
|
|
22
32
|
/** Message to display when no options match the filter. */
|
|
23
33
|
noOptionsFoundMessage?: string | ((filter: string) => string);
|
|
24
34
|
/** Flag indicating the select should be disabled. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TypeaheadSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/TypeaheadSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,iBAAiB,EAOjB,eAAe,EACf,WAAW,EACZ,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC/E,oCAAoC;IACpC,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"TypeaheadSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/TypeaheadSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIL,iBAAiB,EAOjB,eAAe,EACf,WAAW,EACZ,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC;IAC/E,oCAAoC;IACpC,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,kCAAkC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,UAAU,CAAC;IACpF,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,qCAAqC;IACrC,cAAc,EAAE,qBAAqB,EAAE,CAAC;IACxC,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CACT,MAAM,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,GAAG,SAAS,EACjG,SAAS,EAAE,MAAM,GAAG,MAAM,KACvB,IAAI,CAAC;IACV,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mEAAmE;IACnE,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,2DAA2D;IAC3D,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gEAAgE;IAChE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sEAAsE;IACtE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,gDAAgD;IAChD,mBAAmB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IAC9D,wDAAwD;IACxD,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,2DAA2D;IAC3D,qBAAqB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IAC9D,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AAKD,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,iBAAiB,CAAC,oBAAoB,CA6T7E,CAAC;AAGF,eAAO,MAAM,eAAe,kFAE1B,CAAC"}
|
|
@@ -5,11 +5,14 @@ const tslib_1 = require("tslib");
|
|
|
5
5
|
const react_1 = tslib_1.__importDefault(require("react"));
|
|
6
6
|
const react_core_1 = require("@patternfly/react-core");
|
|
7
7
|
const times_icon_1 = tslib_1.__importDefault(require('@patternfly/react-icons/dist/js/icons/times-icon'));
|
|
8
|
+
const defaultNoOptionsFoundMessage = (filter) => `No results found for "${filter}"`;
|
|
9
|
+
const defaultCreateOptionMessage = (newValue) => `Create "${newValue}"`;
|
|
8
10
|
const TypeaheadSelectBase = (_a) => {
|
|
9
|
-
var
|
|
11
|
+
var _b, _c, _d, _e;
|
|
12
|
+
var { innerRef, initialOptions, onSelect, onToggle, onInputChange, onClearSelection, placeholder = 'Select an option', noOptionsAvailableMessage = 'No options are available', noOptionsFoundMessage = defaultNoOptionsFoundMessage, isCreatable = false, isCreateOptionOnTop = false, createOptionMessage = defaultCreateOptionMessage, isDisabled, toggleWidth, toggleProps } = _a, props = tslib_1.__rest(_a, ["innerRef", "initialOptions", "onSelect", "onToggle", "onInputChange", "onClearSelection", "placeholder", "noOptionsAvailableMessage", "noOptionsFoundMessage", "isCreatable", "isCreateOptionOnTop", "createOptionMessage", "isDisabled", "toggleWidth", "toggleProps"]);
|
|
10
13
|
const [isOpen, setIsOpen] = react_1.default.useState(false);
|
|
11
|
-
const [selected, setSelected] = react_1.default.useState('');
|
|
12
|
-
const [inputValue, setInputValue] = react_1.default.useState('');
|
|
14
|
+
const [selected, setSelected] = react_1.default.useState(String((_c = (_b = initialOptions.find((o) => o.selected)) === null || _b === void 0 ? void 0 : _b.content) !== null && _c !== void 0 ? _c : ''));
|
|
15
|
+
const [inputValue, setInputValue] = react_1.default.useState(String((_e = (_d = initialOptions.find((o) => o.selected)) === null || _d === void 0 ? void 0 : _d.content) !== null && _e !== void 0 ? _e : ''));
|
|
13
16
|
const [filterValue, setFilterValue] = react_1.default.useState('');
|
|
14
17
|
const [selectOptions, setSelectOptions] = react_1.default.useState(initialOptions);
|
|
15
18
|
const [focusedItemIndex, setFocusedItemIndex] = react_1.default.useState(null);
|
|
@@ -21,6 +24,17 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
21
24
|
// Filter menu items based on the text input value when one exists
|
|
22
25
|
if (filterValue) {
|
|
23
26
|
newSelectOptions = initialOptions.filter((option) => String(option.content).toLowerCase().includes(filterValue.toLowerCase()));
|
|
27
|
+
if (isCreatable &&
|
|
28
|
+
filterValue &&
|
|
29
|
+
!initialOptions.find((o) => String(o.content).toLowerCase() === filterValue.toLowerCase())) {
|
|
30
|
+
const createOption = {
|
|
31
|
+
content: typeof createOptionMessage === 'string' ? createOptionMessage : createOptionMessage(filterValue),
|
|
32
|
+
value: filterValue
|
|
33
|
+
};
|
|
34
|
+
newSelectOptions = isCreateOptionOnTop
|
|
35
|
+
? [createOption, ...newSelectOptions]
|
|
36
|
+
: [...newSelectOptions, createOption];
|
|
37
|
+
}
|
|
24
38
|
// When no options are found after filtering, display 'No results found'
|
|
25
39
|
if (!newSelectOptions.length) {
|
|
26
40
|
newSelectOptions = [
|
|
@@ -32,29 +46,61 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
32
46
|
];
|
|
33
47
|
}
|
|
34
48
|
// Open the menu when the input value changes and the new value is not empty
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
49
|
+
openMenu();
|
|
50
|
+
}
|
|
51
|
+
// When no options are available, display 'No options available'
|
|
52
|
+
if (!newSelectOptions.length) {
|
|
53
|
+
newSelectOptions = [
|
|
54
|
+
{
|
|
55
|
+
isAriaDisabled: true,
|
|
56
|
+
content: noOptionsAvailableMessage,
|
|
57
|
+
value: NO_RESULTS
|
|
58
|
+
}
|
|
59
|
+
];
|
|
38
60
|
}
|
|
39
61
|
setSelectOptions(newSelectOptions);
|
|
40
|
-
}, [
|
|
62
|
+
}, [
|
|
63
|
+
filterValue,
|
|
64
|
+
initialOptions,
|
|
65
|
+
noOptionsFoundMessage,
|
|
66
|
+
isCreatable,
|
|
67
|
+
isCreateOptionOnTop,
|
|
68
|
+
createOptionMessage,
|
|
69
|
+
noOptionsAvailableMessage
|
|
70
|
+
]);
|
|
71
|
+
react_1.default.useEffect(() => {
|
|
72
|
+
var _a;
|
|
73
|
+
// If the selected option changed and the current input value is the previously selected item, update the displayed value.
|
|
74
|
+
const selectedOption = initialOptions.find((o) => o.selected);
|
|
75
|
+
if (inputValue === selected && (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value) !== selected) {
|
|
76
|
+
setInputValue(String((_a = selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.content) !== null && _a !== void 0 ? _a : ''));
|
|
77
|
+
}
|
|
78
|
+
// Only update when options change
|
|
79
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
80
|
+
}, [initialOptions]);
|
|
41
81
|
const setActiveAndFocusedItem = (itemIndex) => {
|
|
42
82
|
setFocusedItemIndex(itemIndex);
|
|
43
83
|
const focusedItem = selectOptions[itemIndex];
|
|
44
|
-
setActiveItemId(focusedItem.value);
|
|
84
|
+
setActiveItemId(String(focusedItem.value));
|
|
45
85
|
};
|
|
46
86
|
const resetActiveAndFocusedItem = () => {
|
|
47
87
|
setFocusedItemIndex(null);
|
|
48
88
|
setActiveItemId(null);
|
|
49
89
|
};
|
|
50
90
|
const openMenu = () => {
|
|
51
|
-
|
|
52
|
-
|
|
91
|
+
if (!isOpen) {
|
|
92
|
+
onToggle && onToggle(true);
|
|
93
|
+
setIsOpen(true);
|
|
94
|
+
}
|
|
53
95
|
};
|
|
54
96
|
const closeMenu = () => {
|
|
55
97
|
onToggle && onToggle(false);
|
|
56
98
|
setIsOpen(false);
|
|
57
99
|
resetActiveAndFocusedItem();
|
|
100
|
+
const option = initialOptions.find((o) => o.value === selected);
|
|
101
|
+
if (option) {
|
|
102
|
+
setInputValue(String(option.content));
|
|
103
|
+
}
|
|
58
104
|
};
|
|
59
105
|
const onInputClick = () => {
|
|
60
106
|
if (!isOpen) {
|
|
@@ -82,15 +128,10 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
82
128
|
onInputChange && onInputChange(value);
|
|
83
129
|
setFilterValue(value);
|
|
84
130
|
resetActiveAndFocusedItem();
|
|
85
|
-
if (value !== selected) {
|
|
86
|
-
setSelected('');
|
|
87
|
-
}
|
|
88
131
|
};
|
|
89
132
|
const handleMenuArrowKeys = (key) => {
|
|
90
133
|
let indexToFocus = 0;
|
|
91
|
-
|
|
92
|
-
openMenu();
|
|
93
|
-
}
|
|
134
|
+
openMenu();
|
|
94
135
|
if (selectOptions.every((option) => option.isDisabled)) {
|
|
95
136
|
return;
|
|
96
137
|
}
|
|
@@ -135,10 +176,7 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
135
176
|
if (isOpen && focusedItem && focusedItem.value !== NO_RESULTS && !focusedItem.isAriaDisabled) {
|
|
136
177
|
selectOption(event, focusedItem);
|
|
137
178
|
}
|
|
138
|
-
|
|
139
|
-
onToggle && onToggle(true);
|
|
140
|
-
setIsOpen(true);
|
|
141
|
-
}
|
|
179
|
+
openMenu();
|
|
142
180
|
break;
|
|
143
181
|
case 'ArrowUp':
|
|
144
182
|
case 'ArrowDown':
|
|
@@ -151,7 +189,7 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
151
189
|
var _a;
|
|
152
190
|
onToggle && onToggle(!isOpen);
|
|
153
191
|
setIsOpen(!isOpen);
|
|
154
|
-
(_a = textInputRef
|
|
192
|
+
(_a = textInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
155
193
|
};
|
|
156
194
|
const onClearButtonClick = () => {
|
|
157
195
|
var _a;
|
|
@@ -160,7 +198,8 @@ const TypeaheadSelectBase = (_a) => {
|
|
|
160
198
|
onInputChange && onInputChange('');
|
|
161
199
|
setFilterValue('');
|
|
162
200
|
resetActiveAndFocusedItem();
|
|
163
|
-
(_a = textInputRef
|
|
201
|
+
(_a = textInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
202
|
+
onClearSelection && onClearSelection();
|
|
164
203
|
};
|
|
165
204
|
const toggle = (toggleRef) => (react_1.default.createElement(react_core_1.MenuToggle, Object.assign({ ref: toggleRef, variant: "typeahead", "aria-label": "Typeahead menu toggle", onClick: onToggleClick, isExpanded: isOpen, isDisabled: isDisabled, isFullWidth: true, style: {
|
|
166
205
|
width: toggleWidth
|