boreal-ui 0.0.33 → 0.0.35
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/core/{Card-BRExeyNd.js → Card-Bagax-bx.js} +2 -2
- package/dist/core/{Card-BRExeyNd.js.map → Card-Bagax-bx.js.map} +1 -1
- package/dist/core/{Card-jrGaJLdX.cjs → Card-DtHJdWNq.cjs} +2 -2
- package/dist/core/{Card-jrGaJLdX.cjs.map → Card-DtHJdWNq.cjs.map} +1 -1
- package/dist/core/Card.cjs.js +1 -1
- package/dist/core/Card.js +1 -1
- package/dist/core/{Chip-C6sk2qAd.cjs → Chip-C8spwPgH.cjs} +2 -2
- package/dist/core/{Chip-C6sk2qAd.cjs.map → Chip-C8spwPgH.cjs.map} +1 -1
- package/dist/core/{Chip-ByR2AKjl.js → Chip-DxwLK-G6.js} +2 -2
- package/dist/core/{Chip-ByR2AKjl.js.map → Chip-DxwLK-G6.js.map} +1 -1
- package/dist/core/Chip.cjs.js +1 -1
- package/dist/core/Chip.js +1 -1
- package/dist/core/{CommandPalette-KcMGDC0i.js → CommandPalette-Dmy5lWzv.js} +2 -2
- package/dist/core/{CommandPalette-KcMGDC0i.js.map → CommandPalette-Dmy5lWzv.js.map} +1 -1
- package/dist/core/{CommandPalette-IOV8q6GZ.cjs → CommandPalette-SxHF3-VM.cjs} +2 -2
- package/dist/core/{CommandPalette-IOV8q6GZ.cjs.map → CommandPalette-SxHF3-VM.cjs.map} +1 -1
- package/dist/core/CommandPalette.cjs.js +1 -1
- package/dist/core/CommandPalette.js +1 -1
- package/dist/core/{Dropdown-CJo6T9__.cjs → Dropdown-Dlo--tIl.cjs} +2 -2
- package/dist/core/{Dropdown-CJo6T9__.cjs.map → Dropdown-Dlo--tIl.cjs.map} +1 -1
- package/dist/core/{Dropdown-Dzjmt9gx.js → Dropdown-GA_yvFVS.js} +2 -2
- package/dist/core/{Dropdown-Dzjmt9gx.js.map → Dropdown-GA_yvFVS.js.map} +1 -1
- package/dist/core/Dropdown.cjs.js +1 -1
- package/dist/core/Dropdown.js +1 -1
- package/dist/core/{FileUpload-Bcu5v4TO.js → FileUpload-DJ1wI_Bm.js} +2 -2
- package/dist/core/{FileUpload-Bcu5v4TO.js.map → FileUpload-DJ1wI_Bm.js.map} +1 -1
- package/dist/core/{FileUpload-DrPV-Oiy.cjs → FileUpload-aqWEEHIW.cjs} +2 -2
- package/dist/core/{FileUpload-DrPV-Oiy.cjs.map → FileUpload-aqWEEHIW.cjs.map} +1 -1
- package/dist/core/FileUpload.cjs.js +1 -1
- package/dist/core/FileUpload.js +1 -1
- package/dist/core/{Footer-vLVfqKWf.js → Footer-9x3F5gZx.js} +2 -2
- package/dist/core/{Footer-vLVfqKWf.js.map → Footer-9x3F5gZx.js.map} +1 -1
- package/dist/core/{Footer-DrYZJObN.cjs → Footer-VpViLKN_.cjs} +2 -2
- package/dist/core/{Footer-DrYZJObN.cjs.map → Footer-VpViLKN_.cjs.map} +1 -1
- package/dist/core/Footer.cjs.js +1 -1
- package/dist/core/Footer.js +1 -1
- package/dist/core/{IconButton-D_W4nsPZ.cjs → IconButton-Bjjlbqiq.cjs} +4 -2
- package/dist/core/IconButton-Bjjlbqiq.cjs.map +1 -0
- package/dist/core/{IconButton-B9WWbeSM.js → IconButton-DgfUCfo9.js} +4 -2
- package/dist/core/IconButton-DgfUCfo9.js.map +1 -0
- package/dist/core/IconButton.cjs.js +1 -1
- package/dist/core/IconButton.js +1 -1
- package/dist/core/MessagePopUp.cjs.js +1 -1
- package/dist/core/MessagePopUp.js +1 -1
- package/dist/core/{MessagePopup-CIsMNnVM.cjs → MessagePopup-D2nlhTvG.cjs} +2 -2
- package/dist/core/{MessagePopup-CIsMNnVM.cjs.map → MessagePopup-D2nlhTvG.cjs.map} +1 -1
- package/dist/core/{MessagePopup-DiipcrNp.js → MessagePopup-eNK7XvUn.js} +2 -2
- package/dist/core/{MessagePopup-DiipcrNp.js.map → MessagePopup-eNK7XvUn.js.map} +1 -1
- package/dist/core/{Modal-BdxvP-Ei.cjs → Modal-B7IqleCB.cjs} +2 -2
- package/dist/core/{Modal-BdxvP-Ei.cjs.map → Modal-B7IqleCB.cjs.map} +1 -1
- package/dist/core/{Modal-Bi8OdWKS.js → Modal-Cy0AsPTV.js} +2 -2
- package/dist/core/{Modal-Bi8OdWKS.js.map → Modal-Cy0AsPTV.js.map} +1 -1
- package/dist/core/Modal.cjs.js +1 -1
- package/dist/core/Modal.js +1 -1
- package/dist/core/{NotificationCenter-BkoTAZCz.js → NotificationCenter-DgSWWT0G.js} +2 -2
- package/dist/core/{NotificationCenter-BkoTAZCz.js.map → NotificationCenter-DgSWWT0G.js.map} +1 -1
- package/dist/core/{NotificationCenter-DpdzdrPB.cjs → NotificationCenter-c99_Xq4J.cjs} +2 -2
- package/dist/core/{NotificationCenter-DpdzdrPB.cjs.map → NotificationCenter-c99_Xq4J.cjs.map} +1 -1
- package/dist/core/NotificationCenter.cjs.js +1 -1
- package/dist/core/NotificationCenter.js +1 -1
- package/dist/core/{Pager-CcIEdgIe.cjs → Pager-BWlXTFPR.cjs} +2 -2
- package/dist/core/{Pager-CcIEdgIe.cjs.map → Pager-BWlXTFPR.cjs.map} +1 -1
- package/dist/core/{Pager-De-awunI.js → Pager-Dr2H_Q5L.js} +2 -2
- package/dist/core/{Pager-De-awunI.js.map → Pager-Dr2H_Q5L.js.map} +1 -1
- package/dist/core/Pager.cjs.js +1 -1
- package/dist/core/Pager.js +1 -1
- package/dist/core/{Stepper-DNSzwiZR.js → Stepper-CxZGa2CS.js} +2 -2
- package/dist/core/{Stepper-DNSzwiZR.js.map → Stepper-CxZGa2CS.js.map} +1 -1
- package/dist/core/{Stepper-Cphvkx0O.cjs → Stepper-gvaKLuno.cjs} +2 -2
- package/dist/core/{Stepper-Cphvkx0O.cjs.map → Stepper-gvaKLuno.cjs.map} +1 -1
- package/dist/core/Stepper.cjs.js +1 -1
- package/dist/core/Stepper.js +1 -1
- package/dist/core/{Tabs-gpyaJFUs.js → Tabs-BaKDr0uF.js} +84 -36
- package/dist/core/Tabs-BaKDr0uF.js.map +1 -0
- package/dist/core/{Tabs-DptKFvPK.cjs → Tabs-C6lDM19i.cjs} +83 -35
- package/dist/core/Tabs-C6lDM19i.cjs.map +1 -0
- package/dist/core/Tabs.cjs.js +1 -1
- package/dist/core/Tabs.js +1 -1
- package/dist/core/TagInput.cjs.js +1 -1
- package/dist/core/TagInput.js +1 -1
- package/dist/core/Taginput-5LKYwPzy.js +311 -0
- package/dist/core/Taginput-5LKYwPzy.js.map +1 -0
- package/dist/core/Taginput-RYBBGWLK.cjs +310 -0
- package/dist/core/Taginput-RYBBGWLK.cjs.map +1 -0
- package/dist/core/{TextArea-Nj-eO3Pv.cjs → TextArea-BAFMXw6Y.cjs} +17 -6
- package/dist/core/TextArea-BAFMXw6Y.cjs.map +1 -0
- package/dist/core/{TextArea-DrU4oCj0.js → TextArea-C2S64tIN.js} +17 -6
- package/dist/core/TextArea-C2S64tIN.js.map +1 -0
- package/dist/core/TextArea.cjs.js +1 -1
- package/dist/core/TextArea.js +1 -1
- package/dist/core/{TextInput-B03e-LMT.cjs → TextInput-5Bpg7Tdt.cjs} +28 -11
- package/dist/core/TextInput-5Bpg7Tdt.cjs.map +1 -0
- package/dist/core/{TextInput-C8mNE1R4.js → TextInput-DQPZXEA2.js} +28 -11
- package/dist/core/TextInput-DQPZXEA2.js.map +1 -0
- package/dist/core/TextInput.cjs.js +1 -1
- package/dist/core/TextInput.js +1 -1
- package/dist/core/{Timeline-D7fd8-u_.js → Timeline-BfJd6flB.js} +22 -16
- package/dist/core/Timeline-BfJd6flB.js.map +1 -0
- package/dist/core/{Timeline-Dk0q-8BZ.cjs → Timeline-Bmnr7xnx.cjs} +22 -16
- package/dist/core/Timeline-Bmnr7xnx.cjs.map +1 -0
- package/dist/core/Timeline.cjs.js +1 -1
- package/dist/core/Timeline.js +1 -1
- package/dist/core/{Toggle-v31rt4Ya.cjs → Toggle-Dor7IEx3.cjs} +36 -15
- package/dist/core/Toggle-Dor7IEx3.cjs.map +1 -0
- package/dist/core/{Toggle-CZftIdc3.js → Toggle-sPyKNt4P.js} +38 -17
- package/dist/core/Toggle-sPyKNt4P.js.map +1 -0
- package/dist/core/Toggle.cjs.js +1 -1
- package/dist/core/Toggle.js +1 -1
- package/dist/core/{Toolbar-Tf01bUjT.js → Toolbar-CSDhcIPb.js} +15 -11
- package/dist/core/Toolbar-CSDhcIPb.js.map +1 -0
- package/dist/core/{Toolbar-zZrwUT66.cjs → Toolbar-xot4FSLU.cjs} +15 -11
- package/dist/core/Toolbar-xot4FSLU.cjs.map +1 -0
- package/dist/core/Toolbar.cjs.js +1 -1
- package/dist/core/Toolbar.js +1 -1
- package/dist/core/Tooltip-BzmV7ztl.cjs +120 -0
- package/dist/core/Tooltip-BzmV7ztl.cjs.map +1 -0
- package/dist/core/Tooltip-iUp73wB4.js +121 -0
- package/dist/core/Tooltip-iUp73wB4.js.map +1 -0
- package/dist/core/Tooltip.cjs.js +1 -1
- package/dist/core/Tooltip.js +1 -1
- package/dist/core/index.cjs.js +20 -20
- package/dist/core/index.js +20 -20
- package/dist/core/style.css +21 -11
- package/dist/next/{Card-BQTJkNCL.cjs → Card-CAH-CrbH.cjs} +2 -2
- package/dist/next/{Card-BQTJkNCL.cjs.map → Card-CAH-CrbH.cjs.map} +1 -1
- package/dist/next/{Card-B9EjkoVy.js → Card-KFr31XTs.js} +2 -2
- package/dist/next/{Card-B9EjkoVy.js.map → Card-KFr31XTs.js.map} +1 -1
- package/dist/next/Card.cjs.js +1 -1
- package/dist/next/Card.js +1 -1
- package/dist/next/CheckBox.cjs.js +1 -1
- package/dist/next/CheckBox.js +1 -1
- package/dist/next/{Checkbox-BMaEzceF.js → Checkbox-CU-XrZC7.js} +44 -44
- package/dist/next/{Checkbox-BMaEzceF.js.map → Checkbox-CU-XrZC7.js.map} +1 -1
- package/dist/next/{Checkbox-NAEbjhCf.cjs → Checkbox-DXRmAtTt.cjs} +44 -44
- package/dist/next/{Checkbox-NAEbjhCf.cjs.map → Checkbox-DXRmAtTt.cjs.map} +1 -1
- package/dist/next/{Chip-CfJ473TI.cjs → Chip-C7w9CTed.cjs} +2 -2
- package/dist/next/{Chip-CfJ473TI.cjs.map → Chip-C7w9CTed.cjs.map} +1 -1
- package/dist/next/{Chip-CekCQRke.js → Chip-Qa_1km99.js} +2 -2
- package/dist/next/{Chip-CekCQRke.js.map → Chip-Qa_1km99.js.map} +1 -1
- package/dist/next/Chip.cjs.js +1 -1
- package/dist/next/Chip.js +1 -1
- package/dist/next/{CommandPalette-BEDyY7vY.js → CommandPalette-D6ZeGNWl.js} +2 -2
- package/dist/next/{CommandPalette-BEDyY7vY.js.map → CommandPalette-D6ZeGNWl.js.map} +1 -1
- package/dist/next/{CommandPalette-DhyChRCJ.cjs → CommandPalette-DHTJFymB.cjs} +2 -2
- package/dist/next/{CommandPalette-DhyChRCJ.cjs.map → CommandPalette-DHTJFymB.cjs.map} +1 -1
- package/dist/next/CommandPalette.cjs.js +1 -1
- package/dist/next/CommandPalette.js +1 -1
- package/dist/next/{Dropdown-qvuelg8z.cjs → Dropdown-BbdsK4H6.cjs} +2 -2
- package/dist/next/{Dropdown-qvuelg8z.cjs.map → Dropdown-BbdsK4H6.cjs.map} +1 -1
- package/dist/next/{Dropdown-DqYjIelJ.js → Dropdown-BvUfz8G7.js} +2 -2
- package/dist/next/{Dropdown-DqYjIelJ.js.map → Dropdown-BvUfz8G7.js.map} +1 -1
- package/dist/next/Dropdown.cjs.js +1 -1
- package/dist/next/Dropdown.js +1 -1
- package/dist/next/{FileUpload-BSqFdKZD.js → FileUpload-BxmKK5BE.js} +2 -2
- package/dist/next/{FileUpload-BSqFdKZD.js.map → FileUpload-BxmKK5BE.js.map} +1 -1
- package/dist/next/{FileUpload-DpxmgS-B.cjs → FileUpload-C95H9D4N.cjs} +2 -2
- package/dist/next/{FileUpload-DpxmgS-B.cjs.map → FileUpload-C95H9D4N.cjs.map} +1 -1
- package/dist/next/FileUpload.cjs.js +1 -1
- package/dist/next/FileUpload.js +1 -1
- package/dist/next/{Footer-CukKL1zM.cjs → Footer-C98DQNB3.cjs} +2 -2
- package/dist/next/{Footer-CukKL1zM.cjs.map → Footer-C98DQNB3.cjs.map} +1 -1
- package/dist/next/{Footer-CD8eu471.js → Footer-DhBE3lNY.js} +2 -2
- package/dist/next/{Footer-CD8eu471.js.map → Footer-DhBE3lNY.js.map} +1 -1
- package/dist/next/Footer.cjs.js +1 -1
- package/dist/next/Footer.js +1 -1
- package/dist/next/{IconButton-B1r838wY.js → IconButton-B_j-S10f.js} +4 -2
- package/dist/next/IconButton-B_j-S10f.js.map +1 -0
- package/dist/next/{IconButton--X_Bqn4g.cjs → IconButton-C3WpabtT.cjs} +4 -2
- package/dist/next/IconButton-C3WpabtT.cjs.map +1 -0
- package/dist/next/IconButton.cjs.js +1 -1
- package/dist/next/IconButton.js +1 -1
- package/dist/next/MessagePopUp.cjs.js +1 -1
- package/dist/next/MessagePopUp.js +1 -1
- package/dist/next/{MessagePopup-Bjgods-d.js → MessagePopup-BFKRiymY.js} +2 -2
- package/dist/next/{MessagePopup-Bjgods-d.js.map → MessagePopup-BFKRiymY.js.map} +1 -1
- package/dist/next/{MessagePopup-BL7842Cu.cjs → MessagePopup-CcM5nRAG.cjs} +2 -2
- package/dist/next/{MessagePopup-BL7842Cu.cjs.map → MessagePopup-CcM5nRAG.cjs.map} +1 -1
- package/dist/next/{Modal-BddVxoXY.js → Modal-DIZf7sgL.js} +2 -2
- package/dist/next/{Modal-BddVxoXY.js.map → Modal-DIZf7sgL.js.map} +1 -1
- package/dist/next/{Modal-Bauehvf1.cjs → Modal-hk84_P6s.cjs} +2 -2
- package/dist/next/{Modal-Bauehvf1.cjs.map → Modal-hk84_P6s.cjs.map} +1 -1
- package/dist/next/Modal.cjs.js +1 -1
- package/dist/next/Modal.js +1 -1
- package/dist/next/{NotificationCenter-dkrHsIKr.cjs → NotificationCenter-CLMiEWUG.cjs} +2 -2
- package/dist/next/{NotificationCenter-dkrHsIKr.cjs.map → NotificationCenter-CLMiEWUG.cjs.map} +1 -1
- package/dist/next/{NotificationCenter-DlbqVzzr.js → NotificationCenter-D3Eucn9z.js} +2 -2
- package/dist/next/{NotificationCenter-DlbqVzzr.js.map → NotificationCenter-D3Eucn9z.js.map} +1 -1
- package/dist/next/NotificationCenter.cjs.js +1 -1
- package/dist/next/NotificationCenter.js +1 -1
- package/dist/next/{Pager-jPCTdMIg.cjs → Pager-BpTg_723.cjs} +2 -2
- package/dist/next/{Pager-jPCTdMIg.cjs.map → Pager-BpTg_723.cjs.map} +1 -1
- package/dist/next/{Pager-CGqvekhJ.js → Pager-nKqhRoht.js} +2 -2
- package/dist/next/{Pager-CGqvekhJ.js.map → Pager-nKqhRoht.js.map} +1 -1
- package/dist/next/Pager.cjs.js +1 -1
- package/dist/next/Pager.js +1 -1
- package/dist/next/{Stepper-kC6EOZ_b.cjs → Stepper-CWXKcAae.cjs} +2 -2
- package/dist/next/{Stepper-kC6EOZ_b.cjs.map → Stepper-CWXKcAae.cjs.map} +1 -1
- package/dist/next/{Stepper-BzItximd.js → Stepper-b-0SYFcE.js} +2 -2
- package/dist/next/{Stepper-BzItximd.js.map → Stepper-b-0SYFcE.js.map} +1 -1
- package/dist/next/Stepper.cjs.js +1 -1
- package/dist/next/Stepper.js +1 -1
- package/dist/next/{Tabs-CuF_JTan.js → Tabs-B94nrX75.js} +84 -36
- package/dist/next/Tabs-B94nrX75.js.map +1 -0
- package/dist/next/{Tabs-DhQgzZKQ.cjs → Tabs-Dom5sh_U.cjs} +83 -35
- package/dist/next/Tabs-Dom5sh_U.cjs.map +1 -0
- package/dist/next/Tabs.cjs.js +1 -1
- package/dist/next/Tabs.js +1 -1
- package/dist/next/{TagInput-DuvUD94J.cjs → TagInput-B6PAcCaw.cjs} +152 -87
- package/dist/next/TagInput-B6PAcCaw.cjs.map +1 -0
- package/dist/next/{TagInput-CJ2XdMU0.js → TagInput-C8hyzJ7f.js} +153 -88
- package/dist/next/TagInput-C8hyzJ7f.js.map +1 -0
- package/dist/next/TagInput.cjs.js +1 -1
- package/dist/next/TagInput.js +1 -1
- package/dist/next/{TextArea-Bmkg-d0v.js → TextArea-C9VGM6pu.js} +17 -6
- package/dist/next/TextArea-C9VGM6pu.js.map +1 -0
- package/dist/next/{TextArea-OpFozktU.cjs → TextArea-Cn2q5KhJ.cjs} +17 -6
- package/dist/next/TextArea-Cn2q5KhJ.cjs.map +1 -0
- package/dist/next/TextArea.cjs.js +1 -1
- package/dist/next/TextArea.js +1 -1
- package/dist/next/{TextInput-CpbTf99E.cjs → TextInput-CUBY6wCB.cjs} +66 -49
- package/dist/next/TextInput-CUBY6wCB.cjs.map +1 -0
- package/dist/next/{TextInput-G1Pvtebv.js → TextInput-Zywm-WEW.js} +66 -49
- package/dist/next/TextInput-Zywm-WEW.js.map +1 -0
- package/dist/next/TextInput.cjs.js +1 -1
- package/dist/next/TextInput.js +1 -1
- package/dist/next/{Timeline-jmKmKwxD.cjs → Timeline-BWx1ROuN.cjs} +22 -16
- package/dist/next/Timeline-BWx1ROuN.cjs.map +1 -0
- package/dist/next/{Timeline-WHRPqD31.js → Timeline-CQxYIXCz.js} +22 -16
- package/dist/next/Timeline-CQxYIXCz.js.map +1 -0
- package/dist/next/Timeline.cjs.js +1 -1
- package/dist/next/Timeline.js +1 -1
- package/dist/next/{Toggle-D1vM9KrI.js → Toggle-Br6GTHrq.js} +38 -17
- package/dist/next/Toggle-Br6GTHrq.js.map +1 -0
- package/dist/next/{Toggle-ei8CN3th.cjs → Toggle-Cs4ail9L.cjs} +36 -15
- package/dist/next/Toggle-Cs4ail9L.cjs.map +1 -0
- package/dist/next/Toggle.cjs.js +1 -1
- package/dist/next/Toggle.js +1 -1
- package/dist/next/{Toolbar-Dv6focMM.cjs → Toolbar-CyjJbHtq.cjs} +15 -11
- package/dist/next/Toolbar-CyjJbHtq.cjs.map +1 -0
- package/dist/next/{Toolbar-Dw__aR2C.js → Toolbar-DgiSHpuZ.js} +15 -11
- package/dist/next/Toolbar-DgiSHpuZ.js.map +1 -0
- package/dist/next/Toolbar.cjs.js +1 -1
- package/dist/next/Toolbar.js +1 -1
- package/dist/next/Tooltip-1m3gCuRE.cjs +165 -0
- package/dist/next/Tooltip-1m3gCuRE.cjs.map +1 -0
- package/dist/next/Tooltip-D5_lSH1z.js +166 -0
- package/dist/next/Tooltip-D5_lSH1z.js.map +1 -0
- package/dist/next/Tooltip.cjs.js +1 -1
- package/dist/next/Tooltip.js +1 -1
- package/dist/next/index.cjs.js +21 -21
- package/dist/next/index.js +21 -21
- package/dist/next/style.css +160 -149
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/dist/types/components/IconButton/IconButton.types.d.ts +2 -0
- package/dist/types/components/IconButton/IconButton.types.d.ts.map +1 -1
- package/dist/types/components/IconButton/IconButtonBase.d.ts.map +1 -1
- package/dist/types/components/Tabs/Tabs.types.d.ts +5 -0
- package/dist/types/components/Tabs/Tabs.types.d.ts.map +1 -1
- package/dist/types/components/Tabs/TabsBase.d.ts +2 -4
- package/dist/types/components/Tabs/TabsBase.d.ts.map +1 -1
- package/dist/types/components/TagInput/TagInputBase.d.ts +2 -6
- package/dist/types/components/TagInput/TagInputBase.d.ts.map +1 -1
- package/dist/types/components/TagInput/Taginput.types.d.ts +5 -0
- package/dist/types/components/TagInput/Taginput.types.d.ts.map +1 -1
- package/dist/types/components/TagInput/core/Taginput.d.ts.map +1 -1
- package/dist/types/components/TextArea/TextAreaBase.d.ts.map +1 -1
- package/dist/types/components/TextInput/TextInputBase.d.ts.map +1 -1
- package/dist/types/components/Timeline/TimelineBase.d.ts.map +1 -1
- package/dist/types/components/Toggle/Toggle.types.d.ts +3 -0
- package/dist/types/components/Toggle/Toggle.types.d.ts.map +1 -1
- package/dist/types/components/Toggle/ToggleBase.d.ts +1 -4
- package/dist/types/components/Toggle/ToggleBase.d.ts.map +1 -1
- package/dist/types/components/Toolbar/ToolbarBase.d.ts +2 -1
- package/dist/types/components/Toolbar/ToolbarBase.d.ts.map +1 -1
- package/dist/types/components/Tooltip/TooltipBase.d.ts +4 -2
- package/dist/types/components/Tooltip/TooltipBase.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/core/IconButton-B9WWbeSM.js.map +0 -1
- package/dist/core/IconButton-D_W4nsPZ.cjs.map +0 -1
- package/dist/core/Tabs-DptKFvPK.cjs.map +0 -1
- package/dist/core/Tabs-gpyaJFUs.js.map +0 -1
- package/dist/core/Taginput-BNZg4SGI.cjs +0 -244
- package/dist/core/Taginput-BNZg4SGI.cjs.map +0 -1
- package/dist/core/Taginput-D0wKEzGh.js +0 -245
- package/dist/core/Taginput-D0wKEzGh.js.map +0 -1
- package/dist/core/TextArea-DrU4oCj0.js.map +0 -1
- package/dist/core/TextArea-Nj-eO3Pv.cjs.map +0 -1
- package/dist/core/TextInput-B03e-LMT.cjs.map +0 -1
- package/dist/core/TextInput-C8mNE1R4.js.map +0 -1
- package/dist/core/Timeline-D7fd8-u_.js.map +0 -1
- package/dist/core/Timeline-Dk0q-8BZ.cjs.map +0 -1
- package/dist/core/Toggle-CZftIdc3.js.map +0 -1
- package/dist/core/Toggle-v31rt4Ya.cjs.map +0 -1
- package/dist/core/Toolbar-Tf01bUjT.js.map +0 -1
- package/dist/core/Toolbar-zZrwUT66.cjs.map +0 -1
- package/dist/core/Tooltip-5SfsTZvz.cjs +0 -105
- package/dist/core/Tooltip-5SfsTZvz.cjs.map +0 -1
- package/dist/core/Tooltip-XfsZnGgV.js +0 -106
- package/dist/core/Tooltip-XfsZnGgV.js.map +0 -1
- package/dist/next/IconButton--X_Bqn4g.cjs.map +0 -1
- package/dist/next/IconButton-B1r838wY.js.map +0 -1
- package/dist/next/Tabs-CuF_JTan.js.map +0 -1
- package/dist/next/Tabs-DhQgzZKQ.cjs.map +0 -1
- package/dist/next/TagInput-CJ2XdMU0.js.map +0 -1
- package/dist/next/TagInput-DuvUD94J.cjs.map +0 -1
- package/dist/next/TextArea-Bmkg-d0v.js.map +0 -1
- package/dist/next/TextArea-OpFozktU.cjs.map +0 -1
- package/dist/next/TextInput-CpbTf99E.cjs.map +0 -1
- package/dist/next/TextInput-G1Pvtebv.js.map +0 -1
- package/dist/next/Timeline-WHRPqD31.js.map +0 -1
- package/dist/next/Timeline-jmKmKwxD.cjs.map +0 -1
- package/dist/next/Toggle-D1vM9KrI.js.map +0 -1
- package/dist/next/Toggle-ei8CN3th.cjs.map +0 -1
- package/dist/next/Toolbar-Dv6focMM.cjs.map +0 -1
- package/dist/next/Toolbar-Dw__aR2C.js.map +0 -1
- package/dist/next/Tooltip-CnwS0tgW.cjs +0 -150
- package/dist/next/Tooltip-CnwS0tgW.cjs.map +0 -1
- package/dist/next/Tooltip-DhRckexD.js +0 -151
- package/dist/next/Tooltip-DhRckexD.js.map +0 -1
|
@@ -95,38 +95,25 @@ const TabsBase = ({
|
|
|
95
95
|
theme = borealStyleConfig.getDefaultTheme(),
|
|
96
96
|
state = "",
|
|
97
97
|
size = borealStyleConfig.getDefaultSize(),
|
|
98
|
+
orientation = "horizontal",
|
|
99
|
+
activationMode = "auto",
|
|
98
100
|
"data-testid": testId = "tabs",
|
|
99
101
|
classMap
|
|
100
102
|
}) => {
|
|
103
|
+
const uid = React.useId();
|
|
104
|
+
const baseId = `${testId}-${uid}`;
|
|
101
105
|
const [activeIndex, setActiveIndex] = React.useState(defaultIndex);
|
|
106
|
+
const [focusIndex, setFocusIndex] = React.useState(defaultIndex);
|
|
102
107
|
const tabRefs = React.useRef([]);
|
|
103
108
|
React.useEffect(() => {
|
|
104
109
|
var _a;
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
const { key } = event;
|
|
113
|
-
const lastIndex = tabs2.length - 1;
|
|
114
|
-
let newIndex = activeIndex;
|
|
115
|
-
if (key === "ArrowRight") {
|
|
116
|
-
newIndex = activeIndex === lastIndex ? 0 : activeIndex + 1;
|
|
117
|
-
} else if (key === "ArrowLeft") {
|
|
118
|
-
newIndex = activeIndex === 0 ? lastIndex : activeIndex - 1;
|
|
119
|
-
} else if (key === "Home") {
|
|
120
|
-
newIndex = 0;
|
|
121
|
-
} else if (key === "End") {
|
|
122
|
-
newIndex = lastIndex;
|
|
123
|
-
}
|
|
124
|
-
if (newIndex !== activeIndex) {
|
|
125
|
-
event.preventDefault();
|
|
126
|
-
setActiveIndex(newIndex);
|
|
127
|
-
onChange == null ? void 0 : onChange(newIndex);
|
|
128
|
-
}
|
|
129
|
-
};
|
|
110
|
+
const current = activationMode === "manual" ? focusIndex : activeIndex;
|
|
111
|
+
tabRefs.current.forEach((el, i) => {
|
|
112
|
+
if (!el) return;
|
|
113
|
+
el.setAttribute("tabindex", i === current ? "0" : "-1");
|
|
114
|
+
});
|
|
115
|
+
(_a = tabRefs.current[current]) == null ? void 0 : _a.focus();
|
|
116
|
+
}, [activeIndex, focusIndex, activationMode]);
|
|
130
117
|
const containerClassNames = React.useMemo(
|
|
131
118
|
() => classNames.combineClassNames(
|
|
132
119
|
classMap.container,
|
|
@@ -143,8 +130,59 @@ const TabsBase = ({
|
|
|
143
130
|
shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
|
|
144
131
|
rounding && classMap[`round${capitalize.capitalize(rounding)}`]
|
|
145
132
|
),
|
|
146
|
-
[classMap]
|
|
133
|
+
[classMap, shadow, rounding]
|
|
147
134
|
);
|
|
135
|
+
const activate = (index) => {
|
|
136
|
+
setActiveIndex(index);
|
|
137
|
+
onChange == null ? void 0 : onChange(index);
|
|
138
|
+
};
|
|
139
|
+
const isDisabled = (index) => {
|
|
140
|
+
var _a;
|
|
141
|
+
return !!((_a = tabs2[index]) == null ? void 0 : _a.disabled);
|
|
142
|
+
};
|
|
143
|
+
const nextEnabled = (start, dir) => {
|
|
144
|
+
const len = tabs2.length;
|
|
145
|
+
let i = start;
|
|
146
|
+
for (let n = 0; n < len; n++) {
|
|
147
|
+
i = (i + dir + len) % len;
|
|
148
|
+
if (!isDisabled(i)) return i;
|
|
149
|
+
}
|
|
150
|
+
return start;
|
|
151
|
+
};
|
|
152
|
+
const onKeyDown = (event) => {
|
|
153
|
+
const horiz = orientation === "horizontal";
|
|
154
|
+
const { key } = event;
|
|
155
|
+
let newFocus = focusIndex;
|
|
156
|
+
if (horiz && key === "ArrowRight") {
|
|
157
|
+
event.preventDefault();
|
|
158
|
+
newFocus = nextEnabled(focusIndex, 1);
|
|
159
|
+
} else if (horiz && key === "ArrowLeft") {
|
|
160
|
+
event.preventDefault();
|
|
161
|
+
newFocus = nextEnabled(focusIndex, -1);
|
|
162
|
+
} else if (!horiz && key === "ArrowDown") {
|
|
163
|
+
event.preventDefault();
|
|
164
|
+
newFocus = nextEnabled(focusIndex, 1);
|
|
165
|
+
} else if (!horiz && key === "ArrowUp") {
|
|
166
|
+
event.preventDefault();
|
|
167
|
+
newFocus = nextEnabled(focusIndex, -1);
|
|
168
|
+
} else if (key === "Home") {
|
|
169
|
+
event.preventDefault();
|
|
170
|
+
newFocus = nextEnabled(-1, 1);
|
|
171
|
+
} else if (key === "End") {
|
|
172
|
+
event.preventDefault();
|
|
173
|
+
newFocus = nextEnabled(0, -1);
|
|
174
|
+
} else if (activationMode === "manual" && (key === "Enter" || key === " ")) {
|
|
175
|
+
event.preventDefault();
|
|
176
|
+
if (!isDisabled(focusIndex)) activate(focusIndex);
|
|
177
|
+
return;
|
|
178
|
+
} else {
|
|
179
|
+
return;
|
|
180
|
+
}
|
|
181
|
+
setFocusIndex(newFocus);
|
|
182
|
+
if (activationMode === "auto") activate(newFocus);
|
|
183
|
+
};
|
|
184
|
+
const currentPanelId = `${baseId}-panel-${activeIndex}`;
|
|
185
|
+
const currentTabId = `${baseId}-tab-${activeIndex}`;
|
|
148
186
|
return /* @__PURE__ */ require$$2.jsxs("div", { className: containerClassNames, "data-testid": testId, children: [
|
|
149
187
|
/* @__PURE__ */ require$$2.jsx(
|
|
150
188
|
"div",
|
|
@@ -152,11 +190,15 @@ const TabsBase = ({
|
|
|
152
190
|
className: classMap.tabs,
|
|
153
191
|
role: "tablist",
|
|
154
192
|
"aria-label": "Tabs",
|
|
155
|
-
|
|
193
|
+
"aria-orientation": orientation,
|
|
194
|
+
onKeyDown,
|
|
156
195
|
"data-testid": `${testId}-tablist`,
|
|
157
196
|
children: tabs2.map((tab2, index) => {
|
|
158
197
|
const Icon = tab2.icon;
|
|
159
198
|
const isActive = index === activeIndex;
|
|
199
|
+
const disabled = isDisabled(index);
|
|
200
|
+
const tabId = `${baseId}-tab-${index}`;
|
|
201
|
+
const panelId = `${baseId}-panel-${index}`;
|
|
160
202
|
return /* @__PURE__ */ require$$2.jsxs(
|
|
161
203
|
"button",
|
|
162
204
|
{
|
|
@@ -165,15 +207,20 @@ const TabsBase = ({
|
|
|
165
207
|
},
|
|
166
208
|
className: classNames.combineClassNames(
|
|
167
209
|
tabClassNames,
|
|
168
|
-
isActive
|
|
210
|
+
isActive && classMap.active,
|
|
211
|
+
disabled && classMap.disabled
|
|
169
212
|
),
|
|
170
|
-
onClick: () => handleTabClick(index),
|
|
171
213
|
role: "tab",
|
|
172
214
|
type: "button",
|
|
173
|
-
tabIndex: isActive ? 0 : -1,
|
|
174
215
|
"aria-selected": isActive,
|
|
175
|
-
"aria-controls":
|
|
176
|
-
id:
|
|
216
|
+
"aria-controls": panelId,
|
|
217
|
+
id: tabId,
|
|
218
|
+
"aria-disabled": disabled || void 0,
|
|
219
|
+
onClick: () => {
|
|
220
|
+
if (disabled) return;
|
|
221
|
+
setFocusIndex(index);
|
|
222
|
+
activate(index);
|
|
223
|
+
},
|
|
177
224
|
"data-testid": `${testId}-tab-${index}`,
|
|
178
225
|
children: [
|
|
179
226
|
Icon && /* @__PURE__ */ require$$2.jsx(
|
|
@@ -198,8 +245,8 @@ const TabsBase = ({
|
|
|
198
245
|
{
|
|
199
246
|
className: classMap.content,
|
|
200
247
|
role: "tabpanel",
|
|
201
|
-
id:
|
|
202
|
-
"aria-labelledby":
|
|
248
|
+
id: currentPanelId,
|
|
249
|
+
"aria-labelledby": currentTabId,
|
|
203
250
|
tabIndex: 0,
|
|
204
251
|
"data-testid": `${testId}-panel`,
|
|
205
252
|
children: tabs2[activeIndex].content
|
|
@@ -207,8 +254,9 @@ const TabsBase = ({
|
|
|
207
254
|
)
|
|
208
255
|
] });
|
|
209
256
|
};
|
|
257
|
+
TabsBase.displayName = "TabsBase";
|
|
210
258
|
const Tabs = (props) => {
|
|
211
259
|
return /* @__PURE__ */ require$$2.jsx(TabsBase, { ...props, classMap: styles });
|
|
212
260
|
};
|
|
213
261
|
exports.Tabs = Tabs;
|
|
214
|
-
//# sourceMappingURL=Tabs-
|
|
262
|
+
//# sourceMappingURL=Tabs-Dom5sh_U.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tabs-Dom5sh_U.cjs","sources":["../../src/components/Tabs/TabsBase.tsx","../../src/components/Tabs/next/Tabs.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState, useId } from \"react\";\r\nimport { BaseTabsProps } from \"./Tabs.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TabsBase: React.FC<BaseTabsProps> = ({\r\n tabs,\r\n defaultIndex = 0,\r\n onChange,\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n className = \"\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n orientation = \"horizontal\",\r\n activationMode = \"auto\",\r\n \"data-testid\": testId = \"tabs\",\r\n classMap,\r\n}) => {\r\n const uid = useId();\r\n const baseId = `${testId}-${uid}`;\r\n\r\n const [activeIndex, setActiveIndex] = useState(defaultIndex);\r\n const [focusIndex, setFocusIndex] = useState(defaultIndex);\r\n\r\n const tabRefs = useRef<(HTMLButtonElement | null)[]>([]);\r\n\r\n useEffect(() => {\r\n const current = activationMode === \"manual\" ? focusIndex : activeIndex;\r\n tabRefs.current.forEach((el, i) => {\r\n if (!el) return;\r\n el.setAttribute(\"tabindex\", i === current ? \"0\" : \"-1\");\r\n });\r\n tabRefs.current[current]?.focus();\r\n }, [activeIndex, focusIndex, activationMode]);\r\n\r\n const containerClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.container,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size],\r\n className\r\n ),\r\n [classMap, theme, state, size, className]\r\n );\r\n\r\n const tabClassNames = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tab,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const activate = (index: number) => {\r\n setActiveIndex(index);\r\n onChange?.(index);\r\n };\r\n\r\n const isDisabled = (index: number) => !!(tabs[index] as any)?.disabled;\r\n\r\n const nextEnabled = (start: number, dir: 1 | -1) => {\r\n const len = tabs.length;\r\n let i = start;\r\n for (let n = 0; n < len; n++) {\r\n i = (i + dir + len) % len;\r\n if (!isDisabled(i)) return i;\r\n }\r\n return start;\r\n };\r\n\r\n const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n const horiz = orientation === \"horizontal\";\r\n const { key } = event;\r\n\r\n let newFocus = focusIndex;\r\n\r\n if (horiz && key === \"ArrowRight\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (horiz && key === \"ArrowLeft\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (!horiz && key === \"ArrowDown\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, 1);\r\n } else if (!horiz && key === \"ArrowUp\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(focusIndex, -1);\r\n } else if (key === \"Home\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(-1, 1);\r\n } else if (key === \"End\") {\r\n event.preventDefault();\r\n newFocus = nextEnabled(0, -1);\r\n } else if (\r\n activationMode === \"manual\" &&\r\n (key === \"Enter\" || key === \" \")\r\n ) {\r\n event.preventDefault();\r\n if (!isDisabled(focusIndex)) activate(focusIndex);\r\n return;\r\n } else {\r\n return;\r\n }\r\n\r\n setFocusIndex(newFocus);\r\n if (activationMode === \"auto\") activate(newFocus);\r\n };\r\n\r\n const currentPanelId = `${baseId}-panel-${activeIndex}`;\r\n const currentTabId = `${baseId}-tab-${activeIndex}`;\r\n\r\n return (\r\n <div className={containerClassNames} data-testid={testId}>\r\n <div\r\n className={classMap.tabs}\r\n role=\"tablist\"\r\n aria-label=\"Tabs\"\r\n aria-orientation={orientation}\r\n onKeyDown={onKeyDown}\r\n data-testid={`${testId}-tablist`}\r\n >\r\n {tabs.map((tab, index) => {\r\n const Icon = tab.icon;\r\n const isActive = index === activeIndex;\r\n const disabled = isDisabled(index);\r\n const tabId = `${baseId}-tab-${index}`;\r\n const panelId = `${baseId}-panel-${index}`;\r\n\r\n return (\r\n <button\r\n key={index}\r\n ref={(el) => {\r\n tabRefs.current[index] = el;\r\n }}\r\n className={combineClassNames(\r\n tabClassNames,\r\n isActive && classMap.active,\r\n disabled && classMap.disabled\r\n )}\r\n role=\"tab\"\r\n type=\"button\"\r\n aria-selected={isActive}\r\n aria-controls={panelId}\r\n id={tabId}\r\n aria-disabled={disabled || undefined}\r\n onClick={() => {\r\n if (disabled) return;\r\n setFocusIndex(index);\r\n activate(index);\r\n }}\r\n data-testid={`${testId}-tab-${index}`}\r\n >\r\n {Icon && (\r\n <div\r\n className={classMap.icon}\r\n aria-hidden=\"true\"\r\n data-testid={`${testId}-icon-${index}`}\r\n >\r\n <Icon />\r\n </div>\r\n )}\r\n {tab.label}\r\n </button>\r\n );\r\n })}\r\n </div>\r\n\r\n <div\r\n className={classMap.content}\r\n role=\"tabpanel\"\r\n id={currentPanelId}\r\n aria-labelledby={currentTabId}\r\n tabIndex={0}\r\n data-testid={`${testId}-panel`}\r\n >\r\n {tabs[activeIndex].content}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTabsBase.displayName = \"TabsBase\";\r\nexport default TabsBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Tabs.module.scss\";\r\nimport TabsBase from \"../TabsBase\";\r\nimport { TabsProps } from \"../Tabs.types\";\r\n\r\nconst Tabs: React.FC<TabsProps> = (props) => {\r\n return <TabsBase {...props} classMap={styles} />;\r\n};\r\n\r\nexport default Tabs;\r\n"],"names":["tabs","getDefaultRounding","getDefaultShadow","getDefaultTheme","getDefaultSize","useId","useState","useRef","useEffect","useMemo","combineClassNames","capitalize","jsxs","jsx","tab"],"mappings":"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"}
|
package/dist/next/Tabs.cjs.js
CHANGED
package/dist/next/Tabs.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
const require$$2 = require("react/jsx-runtime");
|
|
3
|
-
const IconButton = require("./IconButton
|
|
4
|
-
const TextInput = require("./TextInput-
|
|
3
|
+
const IconButton = require("./IconButton-C3WpabtT.cjs");
|
|
4
|
+
const TextInput = require("./TextInput-CUBY6wCB.cjs");
|
|
5
5
|
const React = require("react");
|
|
6
6
|
const CloseIcon = require("./CloseIcon-7hy4qJ9o.cjs");
|
|
7
7
|
const classNames = require("./classNames-BcWMx052.cjs");
|
|
@@ -104,58 +104,116 @@ const TagInputBase = ({
|
|
|
104
104
|
rounding = borealStyleConfig.getDefaultRounding(),
|
|
105
105
|
shadow = borealStyleConfig.getDefaultShadow(),
|
|
106
106
|
"data-testid": testId = "tag-input",
|
|
107
|
-
ariaDescription = "Type a tag and press Enter or comma to add.
|
|
107
|
+
ariaDescription = "Type a tag and press Enter or comma to add. Use arrow keys to navigate suggestions; Enter to select; Escape to close. Backspace removes the last tag when the field is empty.",
|
|
108
108
|
classMap,
|
|
109
109
|
IconButton: IconButton2,
|
|
110
110
|
TextInput: TextInput2
|
|
111
111
|
}) => {
|
|
112
|
-
const
|
|
113
|
-
const
|
|
114
|
-
const
|
|
112
|
+
const uid = React.useId();
|
|
113
|
+
const inputId = `${testId}-input-${uid}`;
|
|
114
|
+
const descId = `${testId}-desc-${uid}`;
|
|
115
|
+
const labelId = `${testId}-label-${uid}`;
|
|
116
|
+
const listboxId = `${testId}-listbox-${uid}`;
|
|
117
|
+
const statusId = `${testId}-status-${uid}`;
|
|
115
118
|
const [inputValue, setInputValue] = React.useState("");
|
|
116
119
|
const [tagList, setTagList] = React.useState(tags);
|
|
117
120
|
const [lastAction, setLastAction] = React.useState("");
|
|
118
121
|
const [suggestions, setSuggestions] = React.useState([]);
|
|
119
|
-
const [
|
|
120
|
-
|
|
121
|
-
);
|
|
122
|
+
const [open, setOpen] = React.useState(false);
|
|
123
|
+
const [activeIndex, setActiveIndex] = React.useState(-1);
|
|
124
|
+
const debounceRef = React.useRef(null);
|
|
125
|
+
const hasTag = (val) => tagList.some((t) => t.toLowerCase() === val.toLowerCase());
|
|
122
126
|
React.useEffect(() => {
|
|
123
|
-
if (!fetchSuggestions
|
|
127
|
+
if (!fetchSuggestions) {
|
|
124
128
|
setSuggestions([]);
|
|
129
|
+
setOpen(false);
|
|
125
130
|
return;
|
|
126
131
|
}
|
|
127
|
-
if (
|
|
128
|
-
|
|
132
|
+
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
133
|
+
const query = inputValue.trim();
|
|
134
|
+
if (!query) {
|
|
135
|
+
setSuggestions([]);
|
|
136
|
+
setOpen(false);
|
|
137
|
+
setActiveIndex(-1);
|
|
138
|
+
return;
|
|
129
139
|
}
|
|
130
|
-
|
|
140
|
+
debounceRef.current = setTimeout(async () => {
|
|
131
141
|
try {
|
|
132
|
-
const result = await fetchSuggestions(
|
|
133
|
-
setSuggestions(result);
|
|
134
|
-
|
|
135
|
-
|
|
142
|
+
const result = await fetchSuggestions(query);
|
|
143
|
+
setSuggestions(result || []);
|
|
144
|
+
setOpen(((result == null ? void 0 : result.length) ?? 0) > 0);
|
|
145
|
+
setActiveIndex(((result == null ? void 0 : result.length) ?? 0) > 0 ? 0 : -1);
|
|
146
|
+
} catch {
|
|
147
|
+
setSuggestions([]);
|
|
148
|
+
setOpen(false);
|
|
149
|
+
setActiveIndex(-1);
|
|
136
150
|
}
|
|
137
151
|
}, debounceMs);
|
|
138
|
-
|
|
139
|
-
|
|
152
|
+
return () => {
|
|
153
|
+
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
154
|
+
};
|
|
140
155
|
}, [inputValue, fetchSuggestions, debounceMs]);
|
|
141
|
-
const
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
setLastAction(`Added tag ${newTag}`);
|
|
150
|
-
}
|
|
151
|
-
setInputValue("");
|
|
152
|
-
}
|
|
156
|
+
const addTag = (raw) => {
|
|
157
|
+
const newTag = raw.trim();
|
|
158
|
+
if (!newTag || hasTag(newTag)) return false;
|
|
159
|
+
const updated = [...tagList, newTag];
|
|
160
|
+
setTagList(updated);
|
|
161
|
+
onChange == null ? void 0 : onChange(updated);
|
|
162
|
+
setLastAction(`Added tag ${newTag}.`);
|
|
163
|
+
return true;
|
|
153
164
|
};
|
|
154
|
-
const
|
|
165
|
+
const removeTag = (tag2) => {
|
|
155
166
|
const updated = tagList.filter((t) => t !== tag2);
|
|
156
167
|
setTagList(updated);
|
|
157
168
|
onChange == null ? void 0 : onChange(updated);
|
|
158
|
-
setLastAction(`Removed tag ${tag2}
|
|
169
|
+
setLastAction(`Removed tag ${tag2}.`);
|
|
170
|
+
};
|
|
171
|
+
const handleKeyDown = (event) => {
|
|
172
|
+
const { key } = event;
|
|
173
|
+
if (open && suggestions.length > 0) {
|
|
174
|
+
if (key === "ArrowDown") {
|
|
175
|
+
event.preventDefault();
|
|
176
|
+
setActiveIndex((i) => (i + 1) % suggestions.length);
|
|
177
|
+
return;
|
|
178
|
+
}
|
|
179
|
+
if (key === "ArrowUp") {
|
|
180
|
+
event.preventDefault();
|
|
181
|
+
setActiveIndex(
|
|
182
|
+
(i) => (i - 1 + suggestions.length) % suggestions.length
|
|
183
|
+
);
|
|
184
|
+
return;
|
|
185
|
+
}
|
|
186
|
+
if (key === "Enter") {
|
|
187
|
+
event.preventDefault();
|
|
188
|
+
const choice = suggestions[activeIndex];
|
|
189
|
+
if (choice && addTag(choice)) {
|
|
190
|
+
setInputValue("");
|
|
191
|
+
}
|
|
192
|
+
setSuggestions([]);
|
|
193
|
+
setOpen(false);
|
|
194
|
+
setActiveIndex(-1);
|
|
195
|
+
return;
|
|
196
|
+
}
|
|
197
|
+
if (key === "Escape") {
|
|
198
|
+
event.preventDefault();
|
|
199
|
+
setSuggestions([]);
|
|
200
|
+
setOpen(false);
|
|
201
|
+
setActiveIndex(-1);
|
|
202
|
+
return;
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
if (key === "Enter" || key === ",") {
|
|
206
|
+
event.preventDefault();
|
|
207
|
+
if (addTag(inputValue)) setInputValue("");
|
|
208
|
+
setSuggestions([]);
|
|
209
|
+
setOpen(false);
|
|
210
|
+
setActiveIndex(-1);
|
|
211
|
+
return;
|
|
212
|
+
}
|
|
213
|
+
if (key === "Backspace" && inputValue === "" && tagList.length > 0) {
|
|
214
|
+
const last = tagList[tagList.length - 1];
|
|
215
|
+
removeTag(last);
|
|
216
|
+
}
|
|
159
217
|
};
|
|
160
218
|
const wrapperClass = React.useMemo(
|
|
161
219
|
() => classNames.combineClassNames(
|
|
@@ -172,15 +230,22 @@ const TagInputBase = ({
|
|
|
172
230
|
shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
|
|
173
231
|
rounding && classMap[`round${capitalize.capitalize(rounding)}`]
|
|
174
232
|
),
|
|
175
|
-
[classMap]
|
|
233
|
+
[classMap, shadow, rounding]
|
|
176
234
|
);
|
|
235
|
+
const handleSuggestionClick = (suggestion) => {
|
|
236
|
+
if (addTag(suggestion)) setInputValue("");
|
|
237
|
+
setSuggestions([]);
|
|
238
|
+
setOpen(false);
|
|
239
|
+
setActiveIndex(-1);
|
|
240
|
+
};
|
|
241
|
+
const activeOptionId = open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : void 0;
|
|
177
242
|
return /* @__PURE__ */ require$$2.jsxs(
|
|
178
243
|
"div",
|
|
179
244
|
{
|
|
180
245
|
className: wrapperClass,
|
|
181
246
|
role: "group",
|
|
182
247
|
"aria-labelledby": labelId,
|
|
183
|
-
"aria-describedby": descId
|
|
248
|
+
"aria-describedby": `${descId} ${statusId}`,
|
|
184
249
|
"data-testid": testId,
|
|
185
250
|
children: [
|
|
186
251
|
/* @__PURE__ */ require$$2.jsx("label", { id: labelId, className: "sr_only", children: "Tag Input" }),
|
|
@@ -193,40 +258,33 @@ const TagInputBase = ({
|
|
|
193
258
|
children: ariaDescription
|
|
194
259
|
}
|
|
195
260
|
),
|
|
196
|
-
/* @__PURE__ */ require$$2.jsx(
|
|
197
|
-
"
|
|
261
|
+
/* @__PURE__ */ require$$2.jsx("ul", { className: classMap.tagContainer, "data-testid": `${testId}-list`, children: tagList.map((tag2, index) => /* @__PURE__ */ require$$2.jsxs(
|
|
262
|
+
"li",
|
|
198
263
|
{
|
|
199
|
-
className:
|
|
200
|
-
|
|
201
|
-
"
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
)
|
|
224
|
-
]
|
|
225
|
-
},
|
|
226
|
-
tag2
|
|
227
|
-
))
|
|
228
|
-
}
|
|
229
|
-
),
|
|
264
|
+
className: tagClass,
|
|
265
|
+
role: "listitem",
|
|
266
|
+
"data-testid": `${testId}-tag-${index}`,
|
|
267
|
+
children: [
|
|
268
|
+
/* @__PURE__ */ require$$2.jsx("span", { className: classMap.tagLabel, children: tag2 }),
|
|
269
|
+
/* @__PURE__ */ require$$2.jsx(
|
|
270
|
+
IconButton2,
|
|
271
|
+
{
|
|
272
|
+
type: "button",
|
|
273
|
+
"aria-label": `Remove tag ${tag2}`,
|
|
274
|
+
className: classMap.removeButton,
|
|
275
|
+
onClick: () => removeTag(tag2),
|
|
276
|
+
"data-testid": `${testId}-remove-${index}`,
|
|
277
|
+
icon: CloseIcon.CloseIcon,
|
|
278
|
+
size: "small",
|
|
279
|
+
theme: "clear",
|
|
280
|
+
shadow: "none",
|
|
281
|
+
iconClassName: classMap.removeButtonIcon
|
|
282
|
+
}
|
|
283
|
+
)
|
|
284
|
+
]
|
|
285
|
+
},
|
|
286
|
+
`${tag2}-${index}`
|
|
287
|
+
)) }),
|
|
230
288
|
/* @__PURE__ */ require$$2.jsx("div", { className: classMap.inputWrapper, children: /* @__PURE__ */ require$$2.jsx(
|
|
231
289
|
TextInput2,
|
|
232
290
|
{
|
|
@@ -240,47 +298,54 @@ const TagInputBase = ({
|
|
|
240
298
|
value: inputValue,
|
|
241
299
|
placeholder: tagList.length === 0 ? placeholder : "",
|
|
242
300
|
onChange: (e) => setInputValue(e.target.value),
|
|
243
|
-
onKeyDown:
|
|
301
|
+
onKeyDown: handleKeyDown,
|
|
302
|
+
autoComplete: "off",
|
|
303
|
+
role: "combobox",
|
|
304
|
+
"aria-autocomplete": "list",
|
|
305
|
+
"aria-expanded": open,
|
|
306
|
+
"aria-controls": listboxId,
|
|
307
|
+
"aria-activedescendant": activeOptionId,
|
|
244
308
|
"aria-label": "Add new tag",
|
|
245
|
-
"aria-describedby": descId
|
|
309
|
+
"aria-describedby": `${descId} ${statusId}`,
|
|
246
310
|
"data-testid": `${testId}-input`
|
|
247
311
|
}
|
|
248
312
|
) }),
|
|
249
|
-
suggestions.length > 0 && /* @__PURE__ */ require$$2.jsx(
|
|
313
|
+
open && suggestions.length > 0 && /* @__PURE__ */ require$$2.jsx(
|
|
250
314
|
"ul",
|
|
251
315
|
{
|
|
252
316
|
className: classMap.suggestionList,
|
|
253
317
|
role: "listbox",
|
|
254
|
-
id:
|
|
255
|
-
|
|
318
|
+
id: listboxId,
|
|
319
|
+
"aria-label": "Tag suggestions",
|
|
256
320
|
"data-testid": `${testId}-suggestions`,
|
|
257
321
|
children: suggestions.map((suggestion, index) => /* @__PURE__ */ require$$2.jsx(
|
|
258
322
|
"li",
|
|
259
323
|
{
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
onChange == null ? void 0 : onChange(updated);
|
|
266
|
-
setLastAction(`Added tag ${suggestion}`);
|
|
267
|
-
}
|
|
268
|
-
setInputValue("");
|
|
269
|
-
setSuggestions([]);
|
|
270
|
-
},
|
|
324
|
+
id: `${listboxId}-opt-${index}`,
|
|
325
|
+
className: classNames.combineClassNames(
|
|
326
|
+
classMap.suggestionItem,
|
|
327
|
+
index === activeIndex && (classMap.active || "")
|
|
328
|
+
),
|
|
271
329
|
role: "option",
|
|
330
|
+
"aria-selected": index === activeIndex,
|
|
331
|
+
onMouseDown: (e) => e.preventDefault(),
|
|
332
|
+
onClick: () => handleSuggestionClick(suggestion),
|
|
272
333
|
"data-testid": `${testId}-suggestion-${index}`,
|
|
273
334
|
children: suggestion
|
|
274
335
|
},
|
|
275
|
-
index
|
|
336
|
+
`${suggestion}-${index}`
|
|
276
337
|
))
|
|
277
338
|
}
|
|
278
339
|
),
|
|
279
|
-
/* @__PURE__ */ require$$2.
|
|
340
|
+
/* @__PURE__ */ require$$2.jsxs("div", { id: statusId, "aria-live": "polite", className: "sr_only", children: [
|
|
341
|
+
open && suggestions.length > 0 ? `${suggestions.length} suggestion${suggestions.length === 1 ? "" : "s"} available.` : "",
|
|
342
|
+
lastAction
|
|
343
|
+
] })
|
|
280
344
|
]
|
|
281
345
|
}
|
|
282
346
|
);
|
|
283
347
|
};
|
|
348
|
+
TagInputBase.displayName = "TagInputBase";
|
|
284
349
|
const TagInput = (props) => {
|
|
285
350
|
return /* @__PURE__ */ require$$2.jsx(
|
|
286
351
|
TagInputBase,
|
|
@@ -293,4 +358,4 @@ const TagInput = (props) => {
|
|
|
293
358
|
);
|
|
294
359
|
};
|
|
295
360
|
exports.TagInput = TagInput;
|
|
296
|
-
//# sourceMappingURL=TagInput-
|
|
361
|
+
//# sourceMappingURL=TagInput-B6PAcCaw.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagInput-B6PAcCaw.cjs","sources":["../../src/components/TagInput/TagInputBase.tsx","../../src/components/TagInput/next/TagInput.tsx"],"sourcesContent":["import React, {\r\n useId,\r\n useState,\r\n KeyboardEvent,\r\n useMemo,\r\n useEffect,\r\n useRef,\r\n} from \"react\";\r\nimport { TagInputBaseProps } from \"./Taginput.types\";\r\nimport { CloseIcon } from \"../../Icons\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultSize,\r\n getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst TagInputBase: React.FC<TagInputBaseProps> = ({\r\n tags = [],\r\n onChange,\r\n fetchSuggestions,\r\n debounceMs = 300,\r\n placeholder = \"Add a tag...\",\r\n theme = getDefaultTheme(),\r\n state = \"\",\r\n size = getDefaultSize(),\r\n rounding = getDefaultRounding(),\r\n shadow = getDefaultShadow(),\r\n \"data-testid\": testId = \"tag-input\",\r\n ariaDescription = \"Type a tag and press Enter or comma to add. Use arrow keys to navigate suggestions; Enter to select; Escape to close. Backspace removes the last tag when the field is empty.\",\r\n classMap,\r\n IconButton,\r\n TextInput,\r\n}) => {\r\n const uid = useId();\r\n const inputId = `${testId}-input-${uid}`;\r\n const descId = `${testId}-desc-${uid}`;\r\n const labelId = `${testId}-label-${uid}`;\r\n const listboxId = `${testId}-listbox-${uid}`;\r\n const statusId = `${testId}-status-${uid}`;\r\n\r\n const [inputValue, setInputValue] = useState(\"\");\r\n const [tagList, setTagList] = useState<string[]>(tags);\r\n const [lastAction, setLastAction] = useState<string>(\"\");\r\n const [suggestions, setSuggestions] = useState<string[]>([]);\r\n const [open, setOpen] = useState(false);\r\n const [activeIndex, setActiveIndex] = useState<number>(-1);\r\n\r\n const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\r\n\r\n const hasTag = (val: string) =>\r\n tagList.some((t) => t.toLowerCase() === val.toLowerCase());\r\n\r\n useEffect(() => {\r\n if (!fetchSuggestions) {\r\n setSuggestions([]);\r\n setOpen(false);\r\n return;\r\n }\r\n if (debounceRef.current) clearTimeout(debounceRef.current);\r\n\r\n const query = inputValue.trim();\r\n if (!query) {\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n return;\r\n }\r\n\r\n debounceRef.current = setTimeout(async () => {\r\n try {\r\n const result = await fetchSuggestions(query);\r\n setSuggestions(result || []);\r\n setOpen((result?.length ?? 0) > 0);\r\n setActiveIndex((result?.length ?? 0) > 0 ? 0 : -1);\r\n } catch {\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n }\r\n }, debounceMs);\r\n\r\n return () => {\r\n if (debounceRef.current) clearTimeout(debounceRef.current);\r\n };\r\n }, [inputValue, fetchSuggestions, debounceMs]);\r\n\r\n const addTag = (raw: string) => {\r\n const newTag = raw.trim();\r\n if (!newTag || hasTag(newTag)) return false;\r\n const updated = [...tagList, newTag];\r\n setTagList(updated);\r\n onChange?.(updated);\r\n setLastAction(`Added tag ${newTag}.`);\r\n return true;\r\n };\r\n\r\n const removeTag = (tag: string) => {\r\n const updated = tagList.filter((t) => t !== tag);\r\n setTagList(updated);\r\n onChange?.(updated);\r\n setLastAction(`Removed tag ${tag}.`);\r\n };\r\n\r\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n const { key } = event;\r\n\r\n if (open && suggestions.length > 0) {\r\n if (key === \"ArrowDown\") {\r\n event.preventDefault();\r\n setActiveIndex((i) => (i + 1) % suggestions.length);\r\n return;\r\n }\r\n if (key === \"ArrowUp\") {\r\n event.preventDefault();\r\n setActiveIndex(\r\n (i) => (i - 1 + suggestions.length) % suggestions.length\r\n );\r\n return;\r\n }\r\n if (key === \"Enter\") {\r\n event.preventDefault();\r\n const choice = suggestions[activeIndex];\r\n if (choice && addTag(choice)) {\r\n setInputValue(\"\");\r\n }\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n return;\r\n }\r\n if (key === \"Escape\") {\r\n event.preventDefault();\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n return;\r\n }\r\n }\r\n\r\n if (key === \"Enter\" || key === \",\") {\r\n event.preventDefault();\r\n if (addTag(inputValue)) setInputValue(\"\");\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n return;\r\n }\r\n\r\n if (key === \"Backspace\" && inputValue === \"\" && tagList.length > 0) {\r\n const last = tagList[tagList.length - 1];\r\n removeTag(last);\r\n }\r\n };\r\n\r\n const wrapperClass = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tagInput,\r\n classMap[theme],\r\n classMap[state],\r\n classMap[size]\r\n ),\r\n [classMap, theme, state, size]\r\n );\r\n\r\n const tagClass = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.tag,\r\n shadow && classMap[`shadow${capitalize(shadow)}`],\r\n rounding && classMap[`round${capitalize(rounding)}`]\r\n ),\r\n [classMap, shadow, rounding]\r\n );\r\n\r\n const handleSuggestionClick = (suggestion: string) => {\r\n if (addTag(suggestion)) setInputValue(\"\");\r\n setSuggestions([]);\r\n setOpen(false);\r\n setActiveIndex(-1);\r\n };\r\n\r\n const activeOptionId =\r\n open && activeIndex >= 0 ? `${listboxId}-opt-${activeIndex}` : undefined;\r\n\r\n return (\r\n <div\r\n className={wrapperClass}\r\n role=\"group\"\r\n aria-labelledby={labelId}\r\n aria-describedby={`${descId} ${statusId}`}\r\n data-testid={testId}\r\n >\r\n <label id={labelId} className=\"sr_only\">\r\n Tag Input\r\n </label>\r\n <div\r\n id={descId}\r\n className=\"sr_only\"\r\n data-testid={`${testId}-description`}\r\n >\r\n {ariaDescription}\r\n </div>\r\n\r\n <ul className={classMap.tagContainer} data-testid={`${testId}-list`}>\r\n {tagList.map((tag, index) => (\r\n <li\r\n key={`${tag}-${index}`}\r\n className={tagClass}\r\n role=\"listitem\"\r\n data-testid={`${testId}-tag-${index}`}\r\n >\r\n <span className={classMap.tagLabel}>{tag}</span>\r\n <IconButton\r\n type=\"button\"\r\n aria-label={`Remove tag ${tag}`}\r\n className={classMap.removeButton}\r\n onClick={() => removeTag(tag)}\r\n data-testid={`${testId}-remove-${index}`}\r\n icon={CloseIcon}\r\n size=\"small\"\r\n theme=\"clear\"\r\n shadow=\"none\"\r\n iconClassName={classMap.removeButtonIcon}\r\n />\r\n </li>\r\n ))}\r\n </ul>\r\n\r\n <div className={classMap.inputWrapper}>\r\n <TextInput\r\n id={inputId}\r\n type=\"text\"\r\n theme={theme}\r\n state={state}\r\n rounding={rounding}\r\n shadow={shadow}\r\n className={classMap.input}\r\n value={inputValue}\r\n placeholder={tagList.length === 0 ? placeholder : \"\"}\r\n onChange={(e: { target: { value: string } }) =>\r\n setInputValue(e.target.value)\r\n }\r\n onKeyDown={handleKeyDown}\r\n autoComplete=\"off\"\r\n role=\"combobox\"\r\n aria-autocomplete=\"list\"\r\n aria-expanded={open}\r\n aria-controls={listboxId}\r\n aria-activedescendant={activeOptionId}\r\n aria-label=\"Add new tag\"\r\n aria-describedby={`${descId} ${statusId}`}\r\n data-testid={`${testId}-input`}\r\n />\r\n </div>\r\n\r\n {open && suggestions.length > 0 && (\r\n <ul\r\n className={classMap.suggestionList}\r\n role=\"listbox\"\r\n id={listboxId}\r\n aria-label=\"Tag suggestions\"\r\n data-testid={`${testId}-suggestions`}\r\n >\r\n {suggestions.map((suggestion, index) => (\r\n <li\r\n key={`${suggestion}-${index}`}\r\n id={`${listboxId}-opt-${index}`}\r\n className={combineClassNames(\r\n classMap.suggestionItem,\r\n index === activeIndex && (classMap.active || \"\")\r\n )}\r\n role=\"option\"\r\n aria-selected={index === activeIndex}\r\n onMouseDown={(e) => e.preventDefault()}\r\n onClick={() => handleSuggestionClick(suggestion)}\r\n data-testid={`${testId}-suggestion-${index}`}\r\n >\r\n {suggestion}\r\n </li>\r\n ))}\r\n </ul>\r\n )}\r\n\r\n <div id={statusId} aria-live=\"polite\" className=\"sr_only\">\r\n {open && suggestions.length > 0\r\n ? `${suggestions.length} suggestion${suggestions.length === 1 ? \"\" : \"s\"} available.`\r\n : \"\"}\r\n {lastAction}\r\n </div>\r\n </div>\r\n );\r\n};\r\n\r\nTagInputBase.displayName = \"TagInputBase\";\r\nexport default TagInputBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Taginput.module.scss\";\r\nimport { IconButton, TextInput } from \"@/index.next\";\r\nimport TagInputBase from \"../TagInputBase\";\r\nimport { TagInputProps } from \"../Taginput.types\";\r\n\r\nconst TagInput: React.FC<TagInputProps> = (props) => {\r\n return (\r\n <TagInputBase\r\n {...props}\r\n classMap={styles}\r\n IconButton={IconButton}\r\n TextInput={TextInput}\r\n />\r\n );\r\n};\r\n\r\nexport default TagInput;\r\n"],"names":["getDefaultTheme","getDefaultSize","getDefaultRounding","getDefaultShadow","IconButton","TextInput","useId","useState","useRef","useEffect","tag","useMemo","combineClassNames","capitalize","jsxs","jsx","CloseIcon"],"mappings":"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"}
|